javascript - 如何使用 jquery 创建 move 句柄

标签 javascript jquery mouse move handle

这更多是理论类型的问题。

在我的网络应用程序中,我想创建一个用户可以单击的按钮,从而启动一个 move 模式,在此期间(直到释放鼠标)所有鼠标 move 都被转换到某个 DIV 上。

为了更好地理解我的意思,想一个盒子来显示图像的一部分(盒子溢出:隐藏) - 我想让它可以在盒子内四处 move 图像,但不是直接拖动图像,而是通过拖动 handle (拖动时不会 move 的 handle )

在最佳情况下,鼠标光标会在拖动操作打开时隐藏。

我的基本想法是使用可拖动对象,但我不知道如何使其既可访问又不可见。

我将如何使用 javascript/jQuery 完成该操作?

最佳答案

让光标不可见并不难,请参阅 this question 上的前两个答案.

至于句柄,您可以尝试使用 jQuery UI Draggable 的句柄选项。使 handle 看起来静止的关键是有一个看起来像 handle 的单独元素,并将真正的 handle (这将是一个空元素)放在它的顶部。

然后,当 stop() 事件被触发时,您可以将真实句柄放回原来的位置,覆盖假句柄。

因此,在 start() 事件中,您可以将一个类添加到使光标不可见的真实句柄(使用前面提到的帖子中的任一方法),并在 stop() 事件触发时删除该类, 导致光标重新出现。

关于javascript - 如何使用 jquery 创建 move 句柄,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12343586/

相关文章:

javascript - 灯箱不会触发 onclick

javascript - 在 multilevelpushmenu 第一次切换之后调用悬停触发器

javascript - 从 div 外部访问图像

java - 获取鼠标位置的更快方法

javascript - 在我刷新之前,Google map 不显示

javascript - 对返回对象中的键值使用进行类型检查

javascript - 即时验证输入

jquery - jQuery UI 自动完成的自定义搜索功能

c++ - Winapi 专用鼠标/键盘

Python/pynput : How to get relative mouse position on change?