Question

我正在为此寻找答案，但尚未找到答案。

我有一个带bootstrap和jQuery可排序的系统，问题是当我将一个元素从一个列表移动到另一个列表时，该元素就像移动慢于鼠标光标一样，它就像在光标和光标之间获得差距一样。元素，当我到达另一个列表时，占位符在鼠标靠近但不在占位符的确切位置时出现，并且元素在后面几个像素

我制作了一个带有快速示例的视频 https://youtu.be/MhxAhIDUj3Y

有关此内容的更多信息我在LI元素中使用了引导程序面板，标记就像这样

<li class="ui-sortable-handle" style="display: list-item;">    
    <div class="panel panel-default span4">
    </div>
</li>

我在sortable上使用的选项是

    placeholder: 'ui-sortable-placeholder',
    connectWith: ".connectedSortable",
    helper: 'clone',
    scroll: false,
    start: function(e, ui){
        ui.placeholder.height(ui.item.height());
    }

你知道是什么让光标和元素之间出现这种奇怪的鼠标间隙吗？

这是一个重现行为的工作小提琴 https://jsfiddle.net/3jj6k7bm/

非常感谢任何帮助，谢谢

Answer 1

这是因为zoom上的<body>设置为80％。该元素实际上与光标一样移动，但由于<body>被缩小，它似乎移动得更少。为了进一步证明这一点，我用body{zoom: 180%;}做了另一个小提琴：https://jsfiddle.net/3jj6k7bm/2/你会发现相反的情况发生了：元素似乎移动得比光标快。

将缩放更改为100％，应该修复。

元素位置和鼠标在jQuery sortable和Bootstrap上的奇怪行为

1 个答案: