jq延迟加载img lazyload的使用

关于网站图片太多，有许多需要用到下拉延迟加载
  

 

 说下jq 延迟加载插件 lazyload 的使用

 

首先头部引入jq  web读取从上到下，不这样下面的jq效果不生效啊！

然后 对需要处理的图片  吧src里面的地址剪切出来，放在 data-original=‘’  里面， 比如：

<img class="lazy" data-original="./1.jpg" width="640" height="800"> 

注意：  第一张图片一定要有宽高。

 最后在最底部引入lazyload插件， 并且对其进行调用：

$(function () {
            $("img").lazyload();
        });

其中一些条件，自己进行筛选了，比如：

threshold : 200    设置离下面200像素进行加载

event : "click" 设置触发条件

effect : "fadeIn" 使用效果淡出

failure_limit : 10 如果图片不连续，这样多搜索几个可见区域然后停止

skip_invisible : false 加载隐藏图片