我用JavaScript构建了一个放大镜，但当我点击放大镜手柄时，我的鼠标光标移动到放大镜圆圈的中心 $（“.menu left preview box preview”）.bind（'click'，函数（e）{ window.location=“page”+（$（this.index（）+1）+“.html”； }); var native_width=0； var native_height=0； var放大mousedown=false； $（“.放大”）.parent（）.mousedown（函数（e）{ 放大鼠标向下=真； }); $（“.放大”）.mousemove（函数（e）{ 如果（放大鼠标向下）{ 如果（！本机_宽度&&！本机_高度）{ var image_object=新图像（）； image_object.src=$（“.small”）.attr（“src”）； 本机\u宽度=图像\u对象.width； 本机高度=图像高度=对象高度； }否则{ var放大_offset=$（this.offset（）； var mx=e.pageX-放大偏移量。左； var my=e.pageY-放大偏移量.top； 如果（mx0）{ $（“.large”）.fadeIn（100）； }否则{ 美元（“.large”）。淡出（100）； } 如果（$（“.large”）.是（“：可见”））{ var rx=Math.round（mx/$（“.small”）.width（）*本机宽度-$（“.large”）.width（）/2）*-1； var ry=Math.round（my/$（“.small”）.height（）*原生高度-$（“.large”）.height（）/2）*-1； var bgp=rx+“px”+ry+“px”； var px=mx-$（“.large”）.width（）/2； var py=my-$（“.large”）.height（）/2； $（“.large”）.css（{left:px，top:py，backgroundPosition:bgp}）； } } } }); $（“.放大”）.parent（）.mouseup（函数（e）{ 放大鼠标向下=假； 美元（“.large”）。淡出（100）； }); $（“.放大”）.parent（）.mouseleave（函数（e）{ 美元（“.large”）。淡出（100）； });

问题是我点击放大镜手柄，然后我的鼠标光标移动到放大镜圆圈的中心，但我不想这样。我希望它可以在手柄和圆圈上拖动，这两种方式都意味着我想拖动放大镜的手柄和圆圈的所有x y位置

---

工作演示：

对您编写的这两行代码进行调整-

var px=mx-$（“.large”）.width（）/2；var py=my-$（“.large”）.height（）/2-不工作请做点什么你做了什么改变？什么不起作用？你问过“你的”代码的原始作者他们会怎么做吗？
$(".menu-left-preview-box-preview").bind('click', function (e) {
    window.location = "page" + ($(this).index() + 1) + ".html";
});

var native_width = 0;
var native_height = 0;
var magnifyIsMouseDown = false;
$(".magnify").parent().mousedown(function (e) {
    magnifyIsMouseDown = true;
});
$(".magnify").mousemove(function (e) {
    if (magnifyIsMouseDown) {
        if (!native_width && !native_height) {
            var image_object = new Image();
            image_object.src = $(".small").attr("src");
            native_width = image_object.width;
            native_height = image_object.height;

        } else {
            var magnify_offset = $(this).offset();
            var mx = e.pageX - magnify_offset.left;
            var my = e.pageY - magnify_offset.top;

            if (mx < $(this).width() && my < $(this).height() && mx > 0 && my > 0) {
                $(".large").fadeIn(100);

            } else {
                $(".large").fadeOut(100);
            }
            if ($(".large").is(":visible")) {
                var rx = Math.round(mx / $(".small").width() * native_width - $(".large").width() / 2) * -1;
                var ry = Math.round(my / $(".small").height() * native_height - $(".large").height() / 2) * -1;
                var bgp = rx + "px " + ry + "px";

                var px = mx - $(".large").width() / 2;
                var py = my - $(".large").height() / 2;
                $(".large").css({ left: px, top: py, backgroundPosition: bgp });
            }
        }
     }
});

$(".magnify").parent().mouseup(function (e) {
    magnifyIsMouseDown = false;
    $(".large").fadeOut(100);
});
$(".magnify").parent().mouseleave(function (e) {
    $(".large").fadeOut(100);
});