Question

正如标题所述，当我移动鼠标时，鼠标的移动速度快于div，而我希望div在移动时保持在鼠标光标下方。我正在使用jQuery UI 1.12.1和jQuery 3.3.1。我在功能中使用了默认选项。

HTML

<div class="popup"></div>

jQuery

$(function()
{
    $(".popup").draggable();
});

有什么想法可能会发生这种情况吗？

Answer 1

是的！如果存在此类问题，则鼠标光标相对于活动元素的位置。用户开始拖动后，光标会立即移动到元素的中心。这样做可以解决您的问题，并且将鼠标光标悬停在活动div的中心。直到您离开鼠标光标.. 这是我上面说的代码.....

<!-- Javascript and Jquery-->

$('div').on('mousedown', function (e) {

    $(this).addClass('active').parents().on('mousemove', function (e) {

        $('.active').offset({

            top: e.pageY - $('.active').outerHeight() / 2,
            left: e.pageX - $('.active').outerWidth() / 2

        }).on('mouseup', function () {

            $(this).removeClass('active');

        });
        
    });
    
    return false;    
});

div {
    cursor: move;
    width:70px;
    height:70px;
    background:black;
    z-index: 1;
    margin:2px;
    float:left;
}
.active {
    background: grey;
    z-index: 2;
}

<!-- HTML-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>

jQuery UI Draggable：鼠标移动速度比可拖动div快

1 个答案: