jQuery UI Sortable 的 cursorAt 选项

什么是 jQuery UI Sortable？

jQuery UI Sortable 是一个基于 jQuery UI 的插件，提供了一个可排序的交互式列表。它的作用是可以让用户通过鼠标拖拽来重新排序列表中的元素，而无需使用任何手动输入排序的方式。

cursorAt 选项是什么？

cursorAt 是 jQuery UI Sortable 的一个选项，用于定义鼠标游标的位置。默认情况下，当用户拖动一个 Sortable 元素时，该元素的左上角会对齐鼠标指针的位置。但有时候您可能希望在鼠标上有一个拖动图标，而不是整个元素。这就是 cursorAt 选项派上用场的时候。

如何使用 cursorAt 选项？

首先，还是要先确保您已经使用了 jQuery UI Sortable。接下来，您可以将 cursorAt 选项传递给 Sortable() 方法。例如，您可以使用以下代码为元素 div1 创建可排序列表：

$("#div1").sortable({
  cursorAt: { top: 10, left: 10 }
});

在上面的代码中，cursorAt: { top: 10, left: 10 } 意味着鼠标指针位于拖动元素的（10，10）位置。

cursorAt 选项的值

cursorAt 选项的值应该是一个对象，其中包含两个属性：top 和 left。它们分别定义了鼠标指针位于拖动元素中心的水平和垂直距离。例如，为了使鼠标指针位于拖动元素的正中心，您可以将 cursorAt 设置为：

$("#div2").sortable({
  cursorAt: { top: 0, left: 0 }
});

结论

使用 cursorAt 选项可以让您更精确地控制鼠标指针的位置，从而在可排序列表中创建一个更出色的用户体验。如果您需要更多的帮助，请参阅 jQuery UI Sortable 文档。