绝对定位：js照样实现瀑布流式布局

《绝对定位：js照样实现瀑布流式布局》由会员上传分享，免费在线阅读，更多相关内容在行业资料-天天文库。

1、绝对定位：JS照样实现瀑布流式布局一夜之间似乎互联网上出现了一种类似瀑布形式的网页布局，如美丽说、蘑菇街等网站都采用这种布局形式。常见的实现方法一般分为：传统多列浮动、CSS3定义、绝对定位。笔者看到网上仅仅有关于CSS的详细教程，未见有绝对定位的相关教程。现在想和各位朋友们分享一下绝对定位的应用及具体代码，希望朋友们能够指出其中的不足之处。　　　　JS的绝对定位分解成三个部分代码，这样清晰，方便查看代码，其中包括：Javascript代码、HTML代码、[AJax封装文件代码。[Javaｓｃｒｉｐｔ]代

2、码<ｓｃｒｉｐｔtype="text/javaｓｃｒｉｐｔ"src="ajax.js"><ｓｃｒｉｐｔtype="text/javaｓｃｒｉｐｔ">window.onload=function(){varoDiv=document.getElementById("div");varoUl=document.getElementsByTagName("ul");window.onscroll=function(){varclientH=document.documentElement.cl

3、ientHeight;varscrollH=document.documentElement.scrollTop

4、

5、document.body.scrollTop;for(vari=0;i

6、tr+')')for(vari=0;i

'+list.title[j]+'

7、0;while(obj){top+=obj.offsetTop;obj=obj.offsetParent}returntop;}}在html的head中，加入<ｓｃｒｉｐｔsrc="js/*.js"type="text/javaｓｃｒｉｐｔ">注：不能是<ｓｃｒｉｐｔsrc="js/*.js"type="text/javaｓｃｒｉｐｔ"/>JS部分处理完毕之后，接下来就是HTML代码部分的书写：[HTML]代码

• 8、images/1.jpg">

  11111111

• 11111111

• 11111111

• 11111111

• 11111111

• 9、g">

  11111111