零星网络

技术&资讯
网站超市

需要前后台演示请留言,或QQ:150623477联系站长。

本成品是基于ASP+Access开发的网站内容管理系统,提供了简介类模块,新闻类模块,产品类模块,图片类模块,下载类模块
· 适用性:充分考虑公司企业的实际需要,确保功能上较强的实用性。
· 易用性:用户界面简洁、美观、友好,易于用户操作和使用,操作人员只需简单学习即可掌握。
· 安全性:安全可靠的权限划分,既考虑信息的共享,又注意信息的保护与隔离。

JS 您的当前位置:首页 > 技术&资讯 > JS

Echo.js – 简单易用的 JavaScript 图片延迟加载插件

发布时间:2015-09-15  浏览次数:  分享到:

 Echo.js 是一个独立的延迟加载图片的 JavaScript 插件。Echo.js 不依赖第三方库,压缩后不到1KB大小。 延迟加载是提高网页首屏显示速度的一种很有效的方法,当图片元素进入窗口可视区域的时候,它就会改变图像的 src 属性,从服务端加载所需的图片,这也是一个异步的过程。

 
一、相关资源
 
1、Echo.js下载:https://github.com/toddmotto/echo
 
2、效果演示:http://toddmotto.com/labs/echo/
 
二、使用方法
 
Echo.js支持IE8+浏览器,使用方法也很简单。在页面中添加一个img标签,将data-echo属性添加到img标签中。如果想使用Echo.js延迟加载背景图像,就在需要延迟加载背景图像的元素添加“data-echo-background”属性和图像URL。
 
XML/HTML Code复制代码
  1. <body>  
  2.   
  3.   <img src="img/blank.gif" alt="Photo" data-echo="img/photo.jpg">  
  4.   
  5.   <script src="dist/echo.js">script>  
  6.   <script>  
  7.   echo.init({  
  8.     offset: 100,  
  9.     throttle: 250,  
  10.     unload: false,  
  11.     callback: function (element, op) {  
  12.       console.log(element, 'has been', op + 'ed')  
  13.     }  
  14.   });  
  15.   
  16.   // echo.render(); is also available for non-scroll callbacks  
  17.   script>  
  18. body>  
 
 
更多参数设置可参看官网:https://github.com/toddmotto/echo

相关评论

    评论加载中...
    评论者:     验证码:
        

首页|网站超市|业界|营销|优化|HTML|JS|JQUERY|DIV+CSS|编程|运营|设计排版|创业|访谈

Copyright © 2006-2015 Power by 零星设计. 联系QQ:150623477
合作共赢、快速高效、优质的网站建设提供商

  • ●在线咨询点击这里给我发消息
  • ●在线咨询点击这里给我发消息
  • ●在线咨询点击这里给我发消息
  • 业务电话正在通话中…
  • 09:00AM-22:00PM
  • 高效优质的网站建设提供商
  • 加入收藏