当我尝试使用可拖动的 jQuery UI 拖动绝对定位和旋转的 div (使用 css3 transform: rotate(45deg)
)时,jQuery 似乎不知道旋转 div 的新原点在哪里。因此,当您开始拖动时,div 会立即移动几个像素。
这是一个 jsFiddle,您可以自己查看: //jsfiddle.net/k7g7R/4/ (通过单击旋转 div 然后拖动它)。
请注意,当可拖动 div 处于相对位置时,它工作得很好。
有谁知道发生了什么,我该如何解决这个问题?
当我尝试使用可拖动的 jQuery UI 拖动绝对定位和旋转的 div (使用 css3 transform: rotate(45deg)
)时,jQuery 似乎不知道旋转 div 的新原点在哪里。因此,当您开始拖动时,div 会立即移动几个像素。
这是一个 jsFiddle,您可以自己查看: //jsfiddle.net/k7g7R/4/ (通过单击旋转 div 然后拖动它)。
请注意,当可拖动 div 处于相对位置时,它工作得很好。
有谁知道发生了什么,我该如何解决这个问题?
可能与 css3 转换后错误的 jQuery offset() 有关:http: //bugs.jqueryui.com/ticket/6844
我解决此问题的方法是在您正在旋转的对象周围放置一个包装器,并使该包装器可拖动。
<div id="container">
<div id="wrap">
<div id="object" style="left: 90px; top: 90px;">Click to rotate, and drag</div>
</div>
</div>
查看您更新的小提琴: http: //jsfiddle.net/k7g7R/128/ (更新链接,因为缺少 jQueryRotate)