- 网上一款流行的瀑布流效果代码，美女瀑布流，基于jquery插件实现，美女图片自动高度适应的一种布局，目前的瀑布流大多都是这种布局风格，经测试，兼容IE8浏览器，同时在火狐、Chrome、Opera、Safari下都有完美表现。
-
<script type="text/javascript" src="http://www.codefans.net/ajaxjs/jquery-1.9.1.min.js"></script><script type="text/javascript">$(function(){function loadMeinv(){var data = 0;for(var i=0;i<9;i++){//每次加载时模拟随机加载图片data = parseInt(Math.random()*9);var html = "";html = '<li><img src = http://www.codefans.net/jscss/demoimg/201405/-'+data+'.jpg><p>src='+data+'.jpg</p></li>';$minUl = getMinUl();$minUl.append(html);}}loadMeinv();$(window).on("scroll",function(){$minUl = getMinUl();if($minUl.height() <= $(window).scrollTop()+$(window).height()){//当最短的ul的高度比窗口滚出去的高度+浏览器高度大时加载新图片loadMeinv();}})function getMinUl(){//每次获取最短的ul,将图片放到其后var $arrUl = $("#container .col");var $minUl =$arrUl.eq(0);$arrUl.each(function(index,elem){if($(elem).height()<$minUl.height()){$minUl = $(elem);}});return $minUl;}})</script>
标签：网站源码
上一篇：像TAB选项卡一样的图片切换效果
下一篇：带小圆点的大屏焦点图轮播代码