ECHO.js 纯javascript轻量级延迟加载的实例代码

前端之家收集整理的这篇文章主要介绍了ECHO.js 纯javascript轻量级延迟加载的实例代码前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

ECHO.js 纯javascript轻量级延迟加载的实例代码

演示

<Meta charset="utf-8"> 简单的JavaScript图像延迟加载库Echo.js

<div class="demo" style="width: 736px; margin: 0 auto;">
<img class="lazy" src="images/blank.gif" data-echo="images/big-1.jpg">
<img class="lazy" src="images/blank.gif" data-echo="images/big-2.jpg">
<img class="lazy" src="images/blank.gif" data-echo="images/big-3.jpg">
<img class="lazy" src="images/blank.gif" data-echo="images/big-4.jpg">
<img class="lazy" src="images/blank.gif" data-echo="images/big-5.jpg">
<img class="lazy" src="images/blank.gif" data-echo="images/big-6.jpg">
<img class="lazy" src="images/blank.gif" data-echo="images/big-7.jpg">

<script src="js/echo.min.js">

应用

1.引入js,并初始化

2.给图片附上属性

logoimg}" alt="">

3.给未加载的图片设置默认背景,动态的gif

很方便,很实用。 要想进一步提升网页打开速度,可以优化上传图片

网页慢,无非是,一查询慢,二图片加载慢,三没有使用延迟加载,四图片数据太大。

根据这些原因,逐步解决

提升用户体验。

以上这篇ECHO.js 纯javascript轻量级延迟加载的实例代码就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持编程之家。

原文链接:https://www.f2er.com/js/48496.html

猜你在找的JavaScript相关文章