zoukankan      html  css  js  c++  java
  • 如何实现图片逐渐加载逐渐显示 转载

    图片站打开速度慢怎么办?空间不好有几张图片打开速度慢,怎么办?等等,对于有图片的网站打开速度慢,会导致用户不耐烦的跳出,使网站的跳出率增加,这也是网站排名迟迟上不去的原因之一。今天东东SEO博客给大家分享一个图片延迟加载技术(ImageLazyLoad技术)。

    一、ImageLazyLoad技术介绍:

    1、在页面上图片比较多的时候,打开一张页面必然引起与服务器大数据量的交互。尤其是对于高清晰的图片,占的几M的空间。

    2、ImageLazyLoad技术就是,当前可见界面的图片是加载进来的,而不可见页面(通过滚动条下拉可见)中的图片是不加载的,这样势必会引起速度上质的提升。

    二、图片加载技术的好处:

    图片是在下拉滚动条时加载,这是一个非常不错的用户体验,同时减少了页面加载的时间了,也减轻了服务器的压力。对网站优化有莫大的的好处。

    三、实现方法:

    1、在头部<head></head>直接添加以下三段代码:

    <script type=”text/javascript” src=”js/jquery.js”></script>
    <script type=”text/javascript” src=”js/jquery.lazyload.js”></script>

    <script type=”text/javascript”>
    var Img = “images/lazyload.gif”;
    jQuery.noConflict()(function(){jQuery.noConflict()(“img”).lazyload({placeholder:Img,effect:”fadeIn”});});
    </script>

    如图:

    图片加载技术案例

    2、把JS文件放在模板文件夹里,以及复制images文件里的lazyload.gif,粘贴到我们模板里的images文件夹里。OK完事!

        转自http://www.tangshanseo.net/590.html

    图片加载技术下载地址:http://pan.baidu.com/s/1c0thefu

    案例地址:www.0315zhuangxiu.com

  • 相关阅读:
    aria2
    Tomcat Manager Config
    selenium 入门(Java)
    java线上cpu、内存问题排查方法
    Java多线程知识点
    《Java7并发编程实战手册》读书笔记
    《Java并发编程的艺术》读书笔记
    centos7安装mysql
    Linux用户配置文件
    metasploit魔鬼训练营靶机环境搭建(第二章)
  • 原文地址:https://www.cnblogs.com/xuepei/p/3806368.html
Copyright © 2011-2022 走看看