相信大家见过好多随着页面滚动，动态加载图片等元素的网站，我也是，以前见了好多，只是没时间去研究，今天晚上有空，百度了一下找了一个jquery插件，作者张鑫旭，效果挺好，代码也很简单，使用更方便，废话不多说，贴代码：

使用代码：

 

 

说明：.

 

loadingImg //给图片加个正在加载的图片

 

pixel.gif  //1像素图片

 

 

 

jquery.scrollLoading-min.js  原代码

 

(function($) {
       $.fn.scrollLoading = function(options) {
   var defaults = {
              attr: "data-url"        }; var params = $.extend({}, defaults, options || {});        params.cache = [];        $(this).each(function() {
   var node = this.nodeName.toLowerCase(), url = $(this).attr(params["attr"]); if (!url) { return; } //重组            var data = {
                 obj: $(this),               tag: node,               url: url            };            params.cache.push(data);        }); //动态显示数据        var loading = function() {
   var st = $(window).scrollTop(), sth = st + $(window).height();            $.each(params.cache, function(i, data) {
   var o = data.obj, tag = data.tag, url = data.url; if (o) {
                     post = o.position().top; posb = post + o.height(); if ((post > st && post < sth) || (posb > st && posb < sth)) {
   //在浏览器窗口内                      if (tag === "img") {
   //图片，改变src                          o.attr("src", url);                      } else {
                            o.load(url);                      }                       data.obj = null;                      }               }            });   return false;        }; //事件触发        //加载完毕即执行        loading(); //滚动执行        $(window).bind("scroll", loading);     }; })(jQuery);

over