简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW)
php - Javascript如何实现自动排序？
怪我咯
怪我咯 2017-04-10 17:21:44
0
5
237

一个Metro风格的UI网页，如何实现鼠标拖拽某个图标以后其他图标根据被拖拽图标的位置自动排序？
注意：

  1. 图标大小可能不同；

  2. 要求结果得到保留（重载页面以后布局不变）；

  3. 不需要考虑兼容性，只需简单讲讲大概思路。

效果就像 Windows10 的开始菜单：

怪我咯
怪我咯

走同样的路，发现不同的人生

reply all(5)
伊谢尔伦
伊谢尔伦2017-04-10 17:23:44 5 floor

这个根据坐标来吧，一个图标被拖到一个位置，这个图标的坐标就是新位置的坐标，后面受影响的图标的坐标减去这个拖动图标的宽度或者宽度
Like +0
Add Reply
Ty80
Ty802017-04-10 17:23:44 4 floor

应该有对应的插件吧
Like +0
Add Reply
巴扎黑
巴扎黑2017-04-10 17:23:44 3 floor

个人觉得可以理解为两个位置进行交换,昨天用到一个插件你可以试试"sortable.js"十分小3kb左右,而且很好用
Like +0
Add Reply
伊谢尔伦
伊谢尔伦2017-04-10 17:23:44 2 floor

快速的话建议用插件，自己写那我感觉挺牛
Like +0
Add Reply
PHPzhong
PHPzhong2017-04-10 17:23:44 1 floor

官方有实现和文档
metroui: http://metroui.org.ua/
start-screen: http://metroui.org.ua/templat...
Like +0
Add Reply
Popular Topics
More>
Popular Articles
Popular Tutorials
More>
Related Tutorials
Popular Recommendations
Latest courses
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn：Public welfare online PHP training，Help PHP learners grow quickly！