我正在开发一个 javascript 应用程序,它允许用户在网格样式布局中排列一堆元素,我决定使用jQuery 的可排序库来允许他们移动东西。不同之处在于元素可以是不同大小的,也就是单单元、双单元,最后是可变大小的岛单元。sortable 的说明说使用相同大小的单位,所以在我开始这个项目之前,我做了一个快速演示,看看它是否可以在概念上工作,而且效果很好。例如:
http://cms.memeflash.ca/sortable/demos/sortable/display-grid.html
所以我满怀热情地开始了这个项目,一切都很顺利,直到我遇到了一个我以前没有测试过的盒子样式——参见上面演示中的框 32(我在最初的演示中没有制作这种元素样式)。当您有一个元素的高度大于一个元素但没有整个宽度那么宽时,就会出现问题。您不能将元素放在其左侧超过行的位置,因为可排序使用的机制是浮动的。我知道用于技术的 sortable 使用浮动,但我没有想到这种情况。所以我几乎完成了这个项目,我首先遇到了糟糕假设的砖墙。
我想我在问是否有人对可以容纳不同大小元素的固定布局类型库有任何建议。我正在查看 jquery 的可拖动选项,并且在我发布此内容后可能会开始拼凑一些东西,但我希望那里的某个人能够提供一个不会让我完全重新编程我的应用程序的建议。(原因是我只是将元素作为有序元素的单个列表发布回服务器端,然后服务器转换为用于导出的网格)。