WEB页面优化

延迟加载图片的 jQuery Lazy Load插件

送分小仙女□ 提交于 2019-12-10 11:27:26
Lazy Load 是一个用 JavaScript 编写的 jQuery 插件. 它可以延迟加载长页面中的图片. 在浏览器可视区域外的图片不会被载入, 直到用户将页面滚动到它们所在的位置. 这与图片预加载的处理方式正好是相反的. 在包含很多大图片长页面中延迟加载图片可以加快页面加载速度. 浏览器将会在加载可见图片之后即进入就绪状态. 在某些情况下还可以帮助降低服务器负担. Lazy Load 灵感来自 Matt Mlinac 制作的 YUI ImageLoader 工具箱. 这是 演示页面 . 怎样使用? Lazy Load 依赖于 jQuery. 请将下列代码加入页面 head 区域: 1 2 < script src = "jquery.js" type = "text/javascript" ></ script > < script src = "jquery.lazyload.js" type = "text/javascript" ></ script > 并且在你的执行代码中加入下面语句: 1 $("#img1").lazyload(); 这将使 id=”img1″ 区域下的图片将被延迟加载. 设置敏感度 插件提供了 threshold 选项, 可以通过设置临界值 (触发加载处到图片的距离) 来控制图片的加载. 默认值为 0 (到达图片边界的时候加载). $(“img