关于图片延迟的一点思路

第一张图片直接加载

<div class="imgleft "> 
<img src="http://images.cnblogs.com/newyl_21.jpg" class="lazyImg" width="1032" height="309"  alt="名信系列">

<img src="http://images.cnblogs.com/grey.gif" original="/images/newyl_21.jpg" class="lazyImg" width="1032" height="309"  alt="名信系列">

<img src="http://images.cnblogs.com/grey.gif" original="/images/newyl_21.jpg" class="lazyImg" width="1032" height="309"  alt="名信系列">

<img src="http://images.cnblogs.com/grey.gif" original="/images/newyl_21.jpg" class="lazyImg" width="1032" height="309"  alt="名信系列">

<img src="http://images.cnblogs.com/grey.gif" original="/images/newyl_21.jpg" class="lazyImg" width="1032" height="309"  alt="名信系列">

<img src="http://images.cnblogs.com/grey.gif" original="/images/newyl_21.jpg" class="lazyImg" width="1032" height="309"  alt="名信系列">

<img src="http://images.cnblogs.com/grey.gif" original="/images/newyl_21.jpg" class="lazyImg" width="1032" height="309"  alt="名信系列">

<img src="http://images.cnblogs.com/grey.gif" original="/images/newyl_21.jpg" class="lazyImg" width="1032" height="309"  alt="名信系列">

<img src="http://images.cnblogs.com/grey.gif" original="/images/newyl_21.jpg" class="lazyImg" width="1032" height="309"  alt="名信系列">

<img src="http://images.cnblogs.com/grey.gif" original="/images/newyl_21.jpg" class="lazyImg" width="1032" height="309"  alt="名信系列">

<img src="http://images.cnblogs.com/grey.gif" original="/images/newyl_21.jpg" class="lazyImg" width="1032" height="309"  alt="名信系列">

<img src="http://images.cnblogs.com/grey.gif" original="/images/newyl_21.jpg" class="lazyImg" width="1032" height="309"  alt="名信系列">

<img src="http://images.cnblogs.com/grey.gif" original="/images/newyl_21.jpg" class="lazyImg" width="1032" height="309"  alt="名信系列">

<img src="http://images.cnblogs.com/grey.gif" original="/images/newyl_21.jpg" class="lazyImg" width="1032" height="309"  alt="名信系列">

<div>

 

<script type="text/javascript">

//限定加载范围 从第2张开始到第12张 结束 
var index_n=1;
x=0;
$(document).ready(function(){
$(window).scroll(function() {

x++;
if(x%3==0){
// 滚动高度超过3次，加载图片
$(".imgleft img:eq("+index_n+")").each(function(){
$(this).attr("src",$(this).attr("original"));
});
index_n++
}

//限定加载范围 从第2张开始到第12张 结束 

if(index_n==13){
$(window).unbind("scroll");
return;
}
});
});

</script> 

 

//不知道鼠标滚动发送的次数是否一样  所以可能有的鼠标会不兼容  欢迎拍砖

转载于:https://www.cnblogs.com/liucai/archive/2012/09/21/2696972.html