收藏本站腾讯微博新浪微博

经典论坛

 找回密码
 注册

QQ登录

只需一步,快速开始

蓝色理想 最新研发动态 网站开通淘帖功能 - 蓝色理想插件 论坛内容导读一页看论坛 - 给官方提建议

论坛活动及任务 地图和邮件任务 请多用悬赏提问 热夏来袭,选一款蓝色理想的个性T恤吧!

手机上论坛,使用APP获得更好体验 急需前端攻城狮,获得内部推荐机会 论坛开通淘帖功能,收藏终于可以分类了!

搜索
查看: 1622|回复: 1

[jquery] UL下一组宽度随机的LI如何自动重排难题!!

[复制链接]
发表于 2016-2-28 02:28:14 | 显示全部楼层 |阅读模式
本帖最后由 iou33449999 于 2016-2-28 04:13 编辑

代码如下:最好是保存到本地为html文件后用浏览器打开,不停的F5就可以看到LI的宽度为什么是随机的了。(或者是不停的点击下面代码框的运行按钮) 或者访问这个页面 http://iou33449999.usa3v.com/index.html  注意:当你刷新页面时,可以看到每一个LI的大小在变化,但是,这只是改变了他们的css,但是li的次序目前是没有变的。

现有代码中的js只是为了获取随机的CSS名称;style设置了6种样式;HTML部分是简单的规范结构。

想要实现的效果是:
1、用jquery获得浏览器的宽度
2、用jquery获得每一个li的宽度
3、根据浏览器的宽度,重排这些li(不需要考虑次序),以便达到让每一行都尽可能的排满的效果即可!


可以适当参考一下这个实例:http://www.jb51.net/article/30115.htm                但是他的扩展性。。唉~~~~~

 提示:您可以先修改部分代码再运行


发表于 2016-3-1 10:47:04 | 显示全部楼层
本帖最后由 kele5240 于 2016-3-1 10:51 编辑

不知道你要的是不是这种。

思路呢就是把高度统一,防止因为浮动引起的错位。

本来清除浮动也可以,但是清除浮动之后又要重新计算其他位置,还是统一高度比较简单。调整间距还可以在cssMargin之后加一个值。

基本随便刷都OK了.

再就是代码拷出去刷新看吧,blueidea这个代码运行有问题


 提示:您可以先修改部分代码再运行

回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | 注册

本版积分规则

QQ|小黑屋|Archiver|手机版|blueidea.com ( 湘ICP备12001430号 )  

GMT+8, 2020-10-25 22:09 , Processed in 0.077929 second(s), 7 queries , Gzip On, Memcache On.

Powered by Discuz! X3.2 Licensed

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表