jQuery Unveil – 另一款非常轻量的延迟加载插件

最新推荐文章于 2024-05-09 09:54:04 发布

weixin_33711641

最新推荐文章于 2024-05-09 09:54:04 发布

阅读量132

点赞数

文章标签： javascript ViewUI

原文链接：https://my.oschina.net/yjft/blog/693275

版权

jQuery Unveil 是一款轻量的延迟加载jquery插件，支持提供用于视网膜显示设备的高分辨率图像。这个插件非常有用，它能提高长网页中图像的加载性能，因为视口以外的图像（可见部分网页）将不会被加载，直到用户滚动到它们所在的区域才会被加载显示，大大的提高了网页的打开速度与体验性。

　Query Unveil延迟加载有一些很酷的选项，如自定义效果，容器，事件或数据属性。如果你不想使用这些功能，你可以减小文件的大小，只留下必要的代码来显示图像。

使用方法：

引入核心文件


 <script src="http://ajax.useso.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
 <script src="jquery.unveil.js"></script>

构建html代码，src属性的图片为加载时显示的图片，data-src为真正需要显示的图片，data-src-retina是视网膜上显示的图片

$(document).ready(function() {
  $("img").unveil();
});

设定加载的时间，单位为毫秒，下面代码为加载时长300毫秒

$(document).ready(function() {
  $("img").unveil(300);
});

更多参数请参考实例或是官方文档。

常用的图片延迟加载插件：

转载于:https://my.oschina.net/yjft/blog/693275

关注