微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

jquery – 如何防止Resizable和Draggable元素相互折叠?

大家好.我有以下代码

http://jsfiddle.net/g7Cgg/

如您所见,有两个简单的DIV堆叠在一起.这些DIV中的每一个也都设置为可调整大小和可拖动.但是,请注意,当您尝试调整第一个元素的大小时,第二个元素会折叠到第一个元素上.从我所看到的,这是因为可调整大小将元素更改为绝对位置.我该如何防止这种行为?是否可以在保留拖动元素的能力的同时调整元素的大小?

另请注意,如果将元素更改为具有相对位置(在.demo样式中添加位置:relative!important),则可以防止折叠,但在开始调整大小或拖动时元素会“跳转”.另一种奇怪的行为.谢谢你的帮助.

解决方法

在我的具体情况下,这是我做的修复它:
resizeableObj.resizable({
    start: function(event,ui) {        
        resizeableObj.css({
            position: "relative !important",top: "0 !important",left: "0 !important"
        });
    },stop: function(event,ui) {
        resizeableObj.css({
            position: "",top: "",left: ""
        });
    }
});

如您所见,在可调整大小的开始事件中,将位置设置为相对(通过使用可拖动和可调整大小的音量,添加绝对定位)并将顶部和左侧设置为0以防止您有时看到的“跳跃”.在停止事件中,反转这些更改.在我的案例中,YMMV.

原文地址:https://www.jb51.cc/jquery/241382.html

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐