图片懒加载的方式

前端开发中:往往页面有很多图片,而首屏出现的图片大概就少量几张,全部加载图片的话,不仅影响页面渲染速度,还浪费带宽。首屏加载技术就是图片懒加载,图片到可视区域再加载。

将页面里所有img属性src属性用data-xx代替,当页面滚动直至此图片出现在可视区域时,用js取到该图片的data-xx的值赋给src。

其中两个插件可以帮我们实现图片懒加载。

1、jqueryLazyload 依赖Jquery

2、echo.js方式


参考http://www.cnblogs.com/liliangel/p/6122836.html

http://www.cnblogs.com/flyromance/p/5042187.html

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 前些日子从@张鑫旭微博处得一份推荐(Front-end-tutorial),号称最全的资源教程-前端涉及的所有知识...
    谷子多阅读 4,305评论 0 44
  • 大部分的后端会很很鄙视前端。我也不知道为什么,可能大部分人都会觉得脚本语言根本不算语言。 大多人 会叫我们切图仔,...
    小黑的眼阅读 3,461评论 0 15
  • 你知道么 你跟我约定来世的时候 我是很悲伤的 因为你我都知道 没有来世 这辈子无法在一起 就永远也没有机会在一起了...
    shyaen阅读 151评论 0 0
  • 突然对外贸有种厌倦的感觉,假以时日想换一个行业,换一种活法。什么时候工作成了全部,占据了整个生活,被它牵着走,这样...
    邓dsf阅读 204评论 0 0