这样做的好处当然是如果有用户不需要查看下面的内容，则免去了下面所有图片的请求，这对减少服务器的压力还是很有帮助的。
实现:
其实tudou的实现原理很简单，
1.先把所有需要延迟加载的图片的src都设置成同1个小图片的连接(sprite.gif)，把真真图片的连接放进图片的alt属性中，look下代码：
复制代码 代码如下:
2. 绑定window.scroll事件，在该事件里面的重设所有class为lazyimg的图片的src值，在土豆首页找到如下js:
复制代码 代码如下:
var o=function(){
var s=tui.pos.scrolltop(),q=c;
if(q.box[0]){
var r=q.box.offset().top;
if(r-s>0&&r-tui.pos.windowheight()q.init()
}else{
q.stop()
}
}
if(!h||stui.widget.quickplaylist.load();
h=false
};
o();
$(window).bind(scroll,o);
我没有去跟入查看tui.widget.quickplaylist.load()方法的实现，tudou的js都是压缩混淆的，看起来挺累，不过大家知道原理就可以了。
实例：
上面说了那么多，最后还是来个实例比较实际点，毕竟眼见为实嘛。
复制代码 代码如下:
能看的见到图片：
一开始看不到的图片：
把上面代码copy到本地运行下就可以看到效果了。