个回答

• 浅浅妈

  2016-11-07 16:42:38

  已采纳

  同求解

  0

• qq_overdose_4

  2016-11-05 16:06:32

  js部分

  window.onload=function(){
     waterfall('main','box');
  }
  //根据class获取元素
  function getByClass(parent,clsName)
  {
     var boxArr=new Array();    //用来存储获取到的所有class为box的元素
     oElements=parent.getElementsByTagName("*");  //获取父元素下所有的子元素
     for(var i=0;i<oElements.length;i++)
     {
         if(oElements[i].className=clsName)    //找到要找的元素
         {
             boxArr.push(oElements[i]);
         }
     }
     return boxArr;
  }
  function getMinhIndex(arr,val)
  {
     for(var i in arr)
     {
         if(arr[i]==val)
         {
             return i;
         }
     }
  }
  function waterfall(parent,box)
  {
     //将main下的所有class为box的元素取出来
     var oParent=document.getElementById(parent);
     var oBoxs=getByClass(oParent,box);
     //计算整个页面显示的列数（页面宽/box的宽）
     var oBoxW=oBoxs[0].offsetWidth;
     // 列数
     var cols=Math.floor(document.documentElement.clientWidth/oBoxW);
     //设置main的宽
     oParent.style.cssText='width:'+oBoxW*cols+'px;marign:0 auto';
     var hArr=[];     //存放每一行高度的数组
     for(var i=0;i<oBoxs.length;i++)
     {
         if(i<cols)
         {
             hArr.push(oBoxs[i].offsetHeight);
         }
         else{
             var minH=Math.min.apply(null,hArr);
             var index=getMinhIndex(hArr,minH);
             oBoxs[i].style.position='absolute';
             oBoxs[i].style.top=minH+'px';
             oBoxs[i].style.left=oBoxs[index].offsetLeft+'px';
             hArr[index]+=oBoxs[i].offsetHeight;
         }
     }
  }
  

  0

• qq_TO世界尽头_03751774

  2016-11-05 15:37:57

  源代码是什么？

  0