zoukankan      html  css  js  c++  java
  • JQuery.lazyload 图片延迟加载

    1.引入  jquery.lazyload.js

    2. 延时加载的方式 

    <script type="text/javascript"> 
      $(function() { 
        $("img").lazyload({ 
        effect : "fadeIn" 
       }); 
      }); 
      </script> 

    3. 把阀值设置成200 意思就是当图片没有看到之前先load 200像素。

      $(“img”).lazyload({ threshold : 200 });

    4.  通过设置占位符图片和自定事件来触发加载图片事件。如 event :sporty 和 event : foobar。默认情况下处于等待状态, 直到用户滚动到窗口上图片所在位置. 在灰色占位图片被点击之前阻止加载图片。

      $("img").lazyload({    
        placeholder : "img/grey.gif",    
        event : "click"   
        }); 

    5.  带滚动条的 DIV 元素. 你要做的只是将容器定义为 jQuery 对象并作为参数传到初始化方法里面.

      CSS:
      #container {    
      height: 600px;    
      overflow: scroll;    
      }   

      JavaScript 代码:
      $("img").lazyload({    
      placeholder : "img/grey.gif",    
      container: $("#container")    
      });  

  • 相关阅读:
    java 缓存框架java caching system使用示例
    2020牛客寒假算法集训营2
    VJ train1 O统计问题 题解
    ACM#学习心得0
    2020牛客寒假集训营1
    高精度加减乘除
    VJ train1 I彼岸
    VC编译常见错误
    EVC开发MapXMobile 环境搭建
    用Evc+Pocket PC 2003 开发MapxMobie
  • 原文地址:https://www.cnblogs.com/yi-miao/p/8079257.html
Copyright © 2011-2022 走看看