jQuery UI Draggable cursorAt 选项

概述

cursorAt 是 jQuery UI Draggable 插件中的一个选项，用于设置元素被拖动时鼠标光标的位置。

使用方法

可以通过在创建可拖动元素时，将 cursorAt 选项传递给 draggable() 方法来设置鼠标光标的位置。

$( ".draggable" ).draggable({
  cursorAt: { top: 10, left: 10 }
});

选项值

cursorAt 选项的值是一个对象，可以包含以下属性：

• top: 设置鼠标光标相对于拖动元素顶部的偏移量。
• left: 设置鼠标光标相对于拖动元素左侧的偏移量。

可以将 top 和 left 设置为数字，也可以使用百分比表示相对于元素自身尺寸的偏移量。

示例

下面是一个使用 cursorAt 选项的示例，当拖动元素时，鼠标光标会保持在元素的中心位置：

$( ".draggable" ).draggable({
  cursorAt: { top: 0.5, left: 0.5 },
  drag: function(event, ui) {
    $(this).css("cursor", "move");
  },
  stop: function(event, ui) {
    $(this).css("cursor", "default");
  }
});

结论

通过使用 cursorAt 选项，可以方便地设置拖动元素时鼠标光标的位置，使得拖动操作更加直观和用户友好。

详细的文档请参考 jQuery UI Draggable - cursorAt。