zoukankan      html  css  js  c++  java
  • 图片延迟加载技术

    步骤/方法

    1. 第一,该功能主要依靠jQuery,所以首先要下载程序包,在百度里搜索“图片延迟加载 下载”会有很多的下载包。

    2. 第二,将文件解压,将Js文件夹所有文件上传至网站根目录,目录形式为:
        /Js/lazyload/grey.gif
        /Js/lazyload/jquery.js
        /Js/lazyload/jquery.lazyload.js

    3. 第三,调用方法:
        在需要用到特效的页面上,加上以下代码
        <script type="text/javascript" src="/Js/lazyload/jquery.js"></script>
        <script type="text/javascript" src="/Js/lazyload/jquery.lazyload.js"></script>

    4. 添加调用代码
        <script type="text/javascript">
        $("img").lazyload();
        </script>

      注意:其中img是延迟加载所有图片,也可以根据不同模板作相应改动,比如我这个主题,可以改成#post img,这样只延迟加载#post 容器内的图片,否则可能影响到侧边图片的加载;
        如果上传路径改变,或者加载时图片打叉,说明图片路径不正确,查找jquery.lazyload.js中的placeholder:,将后面的图片地址换成绝对地址即可!

      摘自:http://www.helloweba.com/view-blog-151.html 

               http://jingyan.baidu.com/article/49ad8bce1eb61d5834d8fa83.html

  • 相关阅读:
    面试常考知识点——Java(JVM,JDK,JRE)
    使用CSS transform属性的skewX、skewY沿X、Y轴倾斜元素
    视觉设计应用
    小程序
    小程序获取用户的登录头像和用户名
    整站建设
    2018-05-05(在小程序中使用图标)
    2018-05-03(PHP)
    webpack
    简历
  • 原文地址:https://www.cnblogs.com/myphper/p/3227230.html
Copyright © 2011-2022 走看看