js滚动加载图片

原理：

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.youkuaiyun.com/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