插件描述:和 Lazy Load 一样,Echo.js 也是一个用于图像延迟加载 JavaScript.不同的是 Lazy Load 是基于 jQuery 的插件,而 Echo.js 不依赖于 jQuery 或其他 JavaScript 库,可独立使用.并且 Echo.js 非常小巧,压缩后不足 1KB. 兼容性 Echo.js 使用了 HTML5 的 date 属性,并且需要获取该属性的值,所以它并不兼容 IE6.IE7.虽然 Lazy Load 也使用了 HTML5 的 date 属性,但它…
简介: 和 Lazy Load 一样,Echo.js 也是一个用于图像延迟加载 JavaScript.不同的是 Lazy Load 是基于 jQuery 的插件,而 Echo.js 不依赖于 jQuery 或其他 JavaScript 库,可独立使用.并且 Echo.js 非常小巧,压缩后不足 1KB. 兼容性: Echo.js 使用了 HTML5 的 date 属性,并且需要获取该属性的值,所以它并不兼容 IE6.IE7.虽然 Lazy Load 也使用了 HTML5 的 date 属性,但它…
highlight.js是一款基于JavaScript的语法高亮库,目前支持125种编程语言,有63种可供选择的样式,而且能够做到语言自动识别,和目前主流的JS框架都能兼容,可以混合使用. 这款高亮库可以用在博客系统中,其使用方法及其简单,几乎不需要任何学习成本,下面介绍highlight.js的使用. 1.获取highlight.js库,用户可以从官网获取: 地址:https://highlightjs.org/download/ highlight.js库支持在线定制,按照默认的选择点击Do…
随着javascript的兴起,越来越多的公司开始将JS模块化,以增加开发的效率和减少重复编写代码的.更是为了能更加容易的维护日后的代码,因为现在的随着人们对交互效果的越来越强烈的需求,我们的JS代码也从以前的几十行代码,慢慢的发展到了现在的几百甚至上千过万,但是要怎么才能把这些代码很好的整合起来呢? 面向对象的编程方法应该是目前最为流行的编程方式,将所有代码都模块化,不仅有利于增加我们开发效率,而且还使我们代码更容易维护.今天就推荐一个目前比较流行的require.js库,用来编写javasc…
演示 <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="utf-8"> <title>简单的JavaScript图像延迟加载库Echo.js</title> <style> .demo img { width: 736px; height: 490px; background: url(images/loading.g…
如何使用echo.js实现图片的懒加载(整理) 一.总结 一句话总结:a.在img标签中添加data-echo属性加载真实图片:<img class="loading" src="blank.gif" data-echo="图片真实路径" />,在src属性中加载loading的那个图片: b.引入echo.js; c.在js代码中初始化echo.js(和别的js的用法一样) 1.echo.js中是如何判断元素距离出现在视野里的长度还…
Echo.js 是一个独立的延迟加载图片的 JavaScript 插件.Echo.js 不依赖第三方库,压缩后不到1KB大小. 延迟加载是提高网页首屏显示速度的一种很有效的方法,当图片元素进入窗口可视区域的时候,它就会改变图像的 src 属性,从服务端加载所需的图片,这也是一个异步的过程. 您可能感兴趣的相关文章 那些让人惊叹的的国外创意404错误页面设计 让人爱不释手的精美 Web 应用程序图标素材 赞!10套精美的免费网站后台管理系统模板 期待已久的2012年度最佳 jQuery 插件揭晓…
js里一说到延迟加载,大都离不开两种情形,即外部Js文件的延迟加载,以及网页图片的延迟加载: 1.首先简单说一下js文件的3种延迟加载方式: (1)<script type="text/javascript" defer>,defer属性可以推迟对脚本的解释,直到文档已经显示给用户为止,但只有IE支持defer属性 (2)设置具体的延迟时间,对应的js代码如下: function loadScript(){ var myScript=document.createEleme…
echo.js的github地址:https://github.com/toddmotto/echo   echo是一个独立的JavaScript.轻量级的.延迟图片加载插件,echo压缩后体积不到1k,使用html的标准data-*属性,echo支持IE8+.   使用echo.js非常简单,在网页需要延迟加载的img标签中,设置data-echo属于指向需要加载的图片路径,src属性指向默认加载图片路径.然后引入echo.min.js,并初始化echo即可.   <script src=&quo…
echo.js的github地址:https://github.com/toddmotto/echo   echo是一个独立的JavaScript.轻量级的.延迟图片加载插件,echo压缩后体积不到1k,使用html的标准data-*属性,echo支持IE8+.     一般将其放在滚动事件的下面: <img class="lazy" src="tool/img.gif" :data-echo="i.url"/> 使用echo.js非…