Jquery实现瀑布流特效代码,JS代码库,德仔网

代码语言

代码分类

【JS】 Jquery实现瀑布流特效

作者:邓剑彬 / 发布于2013/3/1/ 2181

此Jquery特效是一款非常流行和实用的瀑布流布局，核心代码只有几十行，是我见过代码量最少的瀑布流布局，非常适合网友们学习哦，希望大家好好看一下这个Jquery特效的原代码，里面的每个功能注释写得非常详细。。


	function PBL(outer,boxs){
	 var pubu = $(outer);
	 var box = $(boxs);
	 var num = Math.floor($(document.body).width()/box.outerWidth());//根据浏览器宽度获得显示的列的数量
	 pubu.width(num*(box.outerWidth()));//给pubu的宽度赋值
	 var allHeight = [];//定义一个数组存储所有列的高度
	 for(var i=0;i<box.length;i++){
	 if (i<num) {
	 allHeight[i]=box.eq(i).outerHeight();
	 }else{
	 var minHeight = Math.min.apply({},allHeight);//获得所有的列中高度最小的列的高度
	 var sy = getSy(minHeight,allHeight);//获取高度最小的列的索引
	 getStyle(box.eq(i),minHeight,sy*box.eq(i).outerWidth(),i,2);
	 allHeight[sy] += box.eq(i).outerHeight();
	 }
	 }
	}

评论列表

本站所提供的代码，版权归原作者所有，若有侵犯作者版权，请与我们联系，我们将立即删除或修改。谢谢!
本站所有代码发布及提供者。

试试其它关键字

　瀑布流　

同语言下

可能有用的

邓剑彬贡献的其它代码(5)