使用 Jquery UI 拖放后居中 #Div（内部小提琴）答案

【问题标题】：Center #Div after Drag or Drop with Jquery UI (fiddle inside)使用 Jquery UI 拖放后居中 #Div（内部小提琴）
【发布时间】：2013-09-19 12:46:23
【问题描述】：

我希望在拖放后始终使 div 居中。

这是我的分叉小提琴 http://jsfiddle.net/vrUgs/895/

这是我的 js：

     $(function() {
    $("#resizable").draggable({
    stop: function(event, ui) 
           {
               $("#resizable").css({
                   'display':'block',
                  'margin':'auto'
               });
           }
    });
    $("#resizable").resizable({
    stop: function(event, ui) 
           {
               $("#resizable").css({
                   'display':'block',
                  'margin':'auto'
               });     
alert("left="+ui.position.left+",width="+ui.size.width);
           }
    });  
    });

问题1：每次拖拽后如何使其居中，并比居中位置报警？

问题 2：我的代码可以简化吗...因为我使用相同的停止功能进行拖放？

感谢您的帮助！

【问题讨论】：

但是如果你把它居中，它只会向上和向下移动
是的，我知道。在生产环境中，我只会将它与可调整大小一起使用，因为使用可拖动它会过时。我有这样做的理由。
好吧，过了一段时间，你能在哪里解决你的问题？
没有。它不接近跨浏览器的兼容性，并且“left：0”弄乱了所有额外的div。这是一个 hack - 我需要一个可靠的解决方案。

标签： jquery jquery-ui resize draggable

【解决方案1】：

$("#resizable").css({
    'display':'block',
    'margin':'auto',
    'left':'0'
});

会做居中部分

见：http://jsfiddle.net/t9rFu/

以及调整大小：

$("#resizable").css({
    'display':'block',
    'margin':'auto',
    'left':'0',
    'position':'relative'
});

http://jsfiddle.net/t9rFu/1/

【讨论】：

那行不通。尝试调整大小，然后它会向左对齐而不是居中。
是的，jquery 显然在调整大小时将位置设置为绝对，编辑了我的答案
jquery代码中的显示和边距css已经过时了