                        课程
                    
                        /前端开发
                        
                            /JavaScript
                        
                        /瀑布流布局

老师的代码，改变窗口大小时还是会出现问题，该怎么解决

momoyy123

2016-05-27

源自：瀑布流布局 2-5

关注问题我要回答

954

操作

收起

2 回答

caicaibestone 回答被采纳 +3 积分
2016-05-28

定义好main盒子的宽度再调整就不会出现问题了

0 回复有任何疑惑可以回复我~

收起回答

momoyy123 提问者

只是不知道有没有更好的办法

2016-05-30 回复有任何疑惑可以回复我~

哲_1996
2016-06-09

源码里用clientWidth来定义列数，又用列数定义main的宽，改变窗口大小后触发滚动事件时，clientWidth会发生变化，所以列数会发生变化。如果是缩小，那么原来在第一行的部分浮动元素会被挤到下面，变成绝对定位，页面重排，没有问题；但是放大的话，列数num变大，原来在第二列的元素是绝对定位，不会回到第一排，所以部分i<num的aPin[i]仍在第二排，而在waterfall函数的for循环中，会把i<num的aPin[i]当成第一排进行排版，导致页面出现错误。可以在for循环面前加一个循环，把i<num的aPin[i]的绝对定位样式去掉，就不会有这个问题了。

3 回复有任何疑惑可以回复我~

收起回答

浅浅妈

大神啊！完美解释了这个bug的成因

2016-11-10 回复有任何疑惑可以回复我~