jQuery UI 可排序 - 保持不同宽度的 div 一个接一个

标签 jquery css jquery-ui sorting jquery-ui-sortable

我有一个问题 - 我想在具有不同元素宽度的列表上使用 jQuery UI 可排序插件,例如 1 li 占总宽度的 100%,另一个占总宽度的 50%的总宽度。
当元素具有不同的高度时问题就开始了 - 它一个接一个地 float (就像任何带有 float 的普通元素一样),但我希望它们在下一个元素之间没有空格,就像这样图片:http://i.stack.imgur.com/tMOBS.jpg

我很想找到相关的东西 - 但我发现的只是关于 2 列链接的东西,它对我没有帮助,因为我不能使用 100% 宽度的元素..

这是我的可排序区域:http://i.stack.imgur.com/ncIk1.jpg

非常感谢

最佳答案

关注the docs即可.可排序 + float = 有趣。此处示例:jsFiddle

编辑:对不起,乔,我误解了你的问题。为了创建具有不同高度的事物的网格,您不能使用 float。事实上,很少有方法可以用不同的宽度 高度来布置事物。像Masonry一样以编程方式进行唯一想到的就是做;如图this demo .

关于jQuery UI 可排序 - 保持不同宽度的 div 一个接一个,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7681189/

相关文章:

javascript - 用于电子邮件 && 复选框验证的 jQuery/JavaScript 测试

jquery - 在特定事件中禁用 caroufredsel

html - 网站重新加载问题

javascript - 如何使用 jQuery 获取被点击的元素文本?

javascript - 如何从jquery自动完成中获取对象值

javascript - 如何触发 jquery ui Accordion 的更改事件?

javascript - 如何使用 jquery 清除单个验证消息

javascript - 如何在保持相同 API 的同时将此 JavaScript 包装在立即调用的函数表达式 (IIFE) 中?

css - 响应式列表布局

javascript - 使用 AWS Amplify 部署时,React JS 应用程序变为空白屏幕