zoukankan      html  css  js  c++  java
  • jquery lazy load

    LazyLoad是一个Js编写的Jq插件,它可以延迟加载页面中的图片,在浏览器可视范围中的图片会被加载。
    如何使用:LazyLoad依赖于Jquery,在html的结尾处 ,就是在</body>前。
    <script type="text/javascript" src="jquery.js"></script>
    <script type="text/javascript" src="jquery.lazyload.js"></script>
    你必须改变图片的标签,图片的地址必须放到data-original属性上。给懒加载图片一个指定的class(例如:lazy)代码如下:
    html:<img class="lazy" alt="" width="640" height="480" data-original="img/example.jpg" />
    js:$(function() {
    $("img.lazy").lazyload();
    })
    这会将所有图进行延迟加载
    设置临界点
    默认情况下只有图片出现在屏幕时才会加载,如果你想提前加载图片,那么可以设置threshold,这个属性的单位是px,不过赋值的时候不用带px ,呵呵。
    设置事件来触发加载
    $("img.lazy").lazyload({
    event : "click"
    });
    使用特效
    $("img.lazy").lazyload({
    effect : "fadeIn"
    });

  • 相关阅读:
    Python操作RabbitMQ
    数组的排序算法
    元类
    Python 中的单例模式
    JS的Ajax和同源策略
    Ajax
    Linux目录结构以及文件操作
    Pymysql
    struts2拦截器和过滤器区别
    为Github 托管项目的访问添加SSH keys
  • 原文地址:https://www.cnblogs.com/ZaraNet/p/9508016.html
Copyright © 2011-2022 走看看