我创建了一个 jsFiddle here在代码中说明我的问题(双击粉红色元素并尝试拖动到蓝色框外,再次双击并比较结果)。
问题:
当我使 CSS 在带有约束的可拖动元素上旋转时,约束无法按预期工作。可以将可拖动元素部分地拖动到容器外。我的猜测是它与 CSS 旋转的工作方式有关,但我不确定。
有什么办法可以解决这个问题吗?
最佳答案
似乎在 css 中应用旋转不会改变标签的宽度和高度。这就是为什么你可以将你的 div 移到外面的原因,因为对于浏览器来说,你的标签的大小(然后是限制)保持不变。您只需检查 div 即可看到这一点。
如果知道宽度和高度,您可以手动设置宽度和高度,或者在每次切换 css 类时动态计算。
See this post similar to your question .
编辑
我找到了一个解决方案来做你想做的事。诀窍是使用容器 div 作为可拖动项,并在子 div 中管理旋转。然后你需要调整 child 的顶部/左侧属性。 我没有寻找更好的公式,只是应用了固定值。但这只是为了看看它是否有效。
希望对您有所帮助。
关于jQuery UI - 可拖动元素在旋转时松开约束,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10013506/