闲着没事,自己写了个瀑布流,我个人写脚本或者是网页的习惯是:只参考别人的效果,很少参考别人的代码,有时侯我宁愿用审查元素来推断代码,也不愿去看源代码。我不知道这个习惯好不好。虽然中间过程是花了我不少时间,但是我做的东西的每一个细节我都还能记清楚(当然肯定后来会忘),因为是我实现的。下面说正题:
瀑布流的主体即为几个ul标签,新增加的元素以 li的形式按照当前 ul的高度有选择性的插入到某个ul下。
主体形式如下:
$(function(){
//alert($(window).height()); 浏览器当前窗口可视区域高度
//alert($(document).height());
//浏览器当前窗口文档的高度 alert($(document.body).height());
//浏览器当前窗口文档body的高度 alert($(document.body).outerHeight(true));
//浏览器当前窗口文档body的总高度 包括border padding margin alert($(window).width());
//浏览器当前窗口可视区域宽度 alert($(document).width());
//浏览器当前窗口文档对象宽度 alert($(document.body).width());
//浏览器当前窗口文档body的高度 alert($(document.body).outerWidth(true));
//浏览器当前窗口文档body的总宽度 包括border padding margin
$(document).scroll(function(){
var pics=$(".pics");
var sc=$(document).scrollTop();
$("#float").text(sc);
for(var i=0;i
var pic=pics.eq(i);
var bottom =pic.offset().top+pic.height();
if((sc+$(window).height())>=bottom){
eval( "var word=" + '"\\u' + (Math.round(Math.random() * 20901) + 19968).toString(16)+'"');
var li=" "+word+"
梦里过客笑眼望,望回廊,秋螽藏
";
pic.append(li);
}
}
});
});