Javascript 缩放的div不能在所有父div上拖动
我目前正在使用Javascript 缩放的div不能在所有父div上拖动,javascript,jquery,css,jquery-ui,Javascript,Jquery,Css,Jquery Ui,我目前正在使用jqueryui进行一个项目，其中我有一个包含多个子项的大div。其想法是，这些子div将由用户先前创建，然后缩小（约为其原始大小的20%）并放置在大div中，用户可以根据自己的喜好对其进行排列 我的问题是，缩放后，我无法将子div拖动到父div中的所有位置。相反，它们似乎被约束为父对象的缩小版本，即使没有对父对象应用缩放变换 这把小提琴说明了这个问题：（尝试将蓝色框拖到最右侧或底部） 还有其他人遇到过这个问题吗？我真的很感激一两个指针 谢谢 HTML: <html>
jqueryui<html>
<div class="container">
<div class="box"></div>
</div>
</html>
.container{
height:500px;
width: 500px;
background-color: red;
}
.box{
height:100px;
width: 100px;
background-color: blue;
-webkit-transform-origin: top left;
-moz-transform-origin: top left;
-webkit-transform: scale(0.5);
-moz-transform: scale(0.5);
}
$(function() {
$('.box').draggable({
containment: 'parent'
});
});
<html>
<div class="container">
<div class="box"></div>
</div>
</html>
.container{
height:500px;
width: 500px;
background-color: red;
}
.box{
height:100px;
width: 100px;
background-color: blue;
-webkit-transform-origin: top left;
-moz-transform-origin: top left;
-webkit-transform: scale(0.5);
-moz-transform: scale(0.5);
}
$(function() {
$('.box').draggable({
containment: 'parent'
});
});
jQueryUI不够聪明，无法处理CSS缩放和旋转，因为它依赖于报告的边界框，而在该上下文中，边界框变得毫无意义 下面是另一个SO问题，需要尝试一些变通方法： 下面是一些答案，您可以找到一个声称可以直接解决此问题的插件。，但它在大约3个月前关闭，无法修复： 我们在会议上讨论了这一点，CSS转换并不是我们计划在可预测功能中随时支持的东西[sic]，因此将其作为wontfix关闭
是的
$（'.box'）.width（）