优茬娱乐网
您的当前位置:首页基于JavaScript实现瀑布流布局_javascript技巧

基于JavaScript实现瀑布流布局_javascript技巧

来源:优茬娱乐网
 本文实例讲解了原生JavaScript实现瀑布流布局详细代码,分享给大家供大家参考,具体内容如下

效果图:

具体代码:

HTML




 
 Document
 
 

CSS代码:

*{
 margin: 0px;
 padding: 0px;
}

#container{
 position: relative;
}

.box{
 padding: 5px;
 float: left;
}
.box_img{
 padding: 5px;
 border: 1px solid #cccccc;
 box-shadow: 0 0 5px #ccc;
 border-radius: 5px;
}

.box_img img{
 width: 150px;
 height:auto;
}

js代码:



希望本文所述对大家学习javascript程序设计有所帮助。

显示全文