jquery布局和动态可拖动div问题

Question

我正在使用 jquery 布局插件，并遇到以下情况，但找不到解决方案。 如何通过将 div 拖动到底部边框之外来永久增加中心窗格的大小。

我有一个左窗格和一个中心窗格。我动态生成div 当用户单击左侧窗格时。 div 已生成并 落在中央窗格上。 div 可拖动且可调整大小。 通过在可见中心上拖动和调整大小，一切正常 区域。当我将 div 拖到底部之外时，滚动条就会打开 出现中心窗格，并且中心窗格似乎延伸到 适应拖动的 div 的新位置。但当我尝试的那一刻 要调整 div 大小或添加另一个 div，它会跳转到 div 并重置滚动条。我检查了中心 div 高度 firebug 初始化时它保持相同的高度 即使将新的 div 拖到底部之外也是如此。

这是测试页html代码。

只需完全复制/粘贴到 html 页面中即可。在左侧窗格中，单击“添加新”按钮将添加可拖动且可调整大小的新 div。

1. 单击“添加新”
2. 将新添加的 div 拖到中心窗格底部之外。
3. 中心窗格按预期显示滚动条。
4. 如果您在 firebug 中检查中心 div 的高度，它不会改变
5. 现在尝试通过拖动其手柄来调整新添加的 div 的大小
6. 它跳到顶部并且中心框失去了滚动条。

我无法粘贴完整的 html 页面，因此这里是对此线程底部代码的引用 http://groups.google.com/group/jquery-ui -layout/browse_thread/thread/ca922aa44c0048ee

这是测试链接 http://jsfiddle.net/yZc63/

Answer 1

我很惊讶以前没有人遇到过这种情况吗？即使没有布局插件，我的解决方案也不是很漂亮。为了在没有布局插件的情况下模拟页面，我必须使用 CSS 中的position:fixed 属性保留顶部和左侧窗格。而且根本没有中心 div。我将新的 div 直接添加到 html 的正文中。原因是我不想在浏览器滚动条顶部看到额外的滚动条。换句话说，当浏览器滚动条移动时，中心窗格应该滚动。我附上解决方案，以便您有一个想法。

如果我可以使用任何其他方法模拟以前的附加文件，即使没有布局插件，我也愿意接受任何解决方案。我附加的页面没有布局插件，但不确定这是否是唯一剩下的优雅解决方案。

您可以在这里查看解决方案 http://jsfiddle.net/c7wrT/

是将动态 div 直接添加到 html body 是一个好方法吗？

Answer 2

我遇到了同样的情况，这个答案有帮助。
https://stackoverflow.com/a/33004821/2139859。 更新的小提琴： http://jsfiddle.net/bababalcksheep/yZc63/11 /

$(".removalbe-recom").draggable({
    appendTo: "body",
    helper: "clone",
    revert: "invalid",
    cursor: "move",
    containment: "document",
    zIndex: 10000,
    scroll:false,
    start: function (event, ui) {
    $(this).hide();
    },
    stop: function (event, ui) {
        $(this).show();
    }
});