JS实现瀑布流布局

本文实例为大家分享了JS实现瀑布流布局展示的具体代码，供大家参考，具体内容如下

html部分

css部分

*{
  padding:0px;
  margin:0px;
}
.main{
  position:relative;
}
.box{
  padding:15px 0 0 10px;
  float:left;
}
.pic{
  padding:10px;
  border: 1px solid #ccc;
  border-radius: 5px;
  box-shadow: 0 0 5px #ccc;
  
}
img{
  width:170px;
  height:auto;
}

JS部分

window.onload=function(){
  waterfall('main','box');
  var dataInt={"data":[{"src":"0.jpg"},{"src":"1.jpg"},{"src":"2.jpg"},{"src":"3.jpg"},{"src":"4.jpg"}]}
  window.onscroll=function(){
    if(checkScrollSlide){
      for(var i=0;iheight?true:false;
}

课程地址。

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持考高分网。