1.图片的真实地址不用src,使用其他属性调用,src采用loading图
<img class="scrollLoading" data-src="http://images.cnblogs.com/cnblogs_com/Darren_code/311197/o_' + i + '.jpg" src="loading.gif" />
2.滚动时,按顺序加载图片,将data-src数据赋值给src,显示图片。加载到该图片时,当图片距顶部的距离<body的高度+滚动条的top时该图片显示出来
3.关键点,获取元素在页面的位置和高度
getPosition : function(obj) {//获取元素在页面里的位置和宽高
var top = 0,
left = 0,
width = obj.offsetWidth,
height = obj.offsetHeight;
while(obj.offsetParent){
top += obj.offsetTop;
left += obj.offsetLeft;
obj = obj.offsetParent;
}
return {"top":top,"left":left,"width":width,"height":height};
}高手写的,不是很懂
参考网址:http://www.jb51.net/article/39009.htm
4.插件:http://download.csdn.net/download/zhaoweitco/2453420
插件的使用http://www.jb51.net/article/46985.htm
原理参考:1.http://www.jb51.net/article/39009.htm
2.http://www.jb51.net/article/39896.htm