类别:Develop / 日期:2020-05-15 / 浏览:243 / 评论:0

懒得翻译了,直接帖原文... 简单来说就是一个占用非常小的,针对图片的屏外延迟加载的JS脚本,SEO首选。但是相对的因为小巧,自然就不会有过渡动画,图片加载的时候就是传统由上到下的显示方式。

lazysizes图片屏外延迟加载 lazysizes js css 延迟 脚本 第1张

lazysizesis a fast (jank-free), SEO-friendly and self-initializing lazyloader for images (including responsive images ``picture``/``srcset``), iframes, scripts/widgets and much more. It also prioritizes resources by differentiating between crucial in view and near view elements to make perceived performance even faster.

It may become also your number one tool to integrate responsive images. It can automatically calculate the ``sizes`` attribute for your responsive images, it allows you to share media queries for your ``media`` attributes with your CSS, helping to separate layout (CSS) from content/structure (HTML) and it makes integrating responsive images into any environment really simple. It also includes a set of optional plugins to further extend its functionality.

1、Download the [lazysizes.min.js script](http://afarkas.github.io/lazysizes/lazysizes.min.js) and include lazysizes in your webpage.
2、<script src="lazysizes.min.js" async=""></script>
3、<img data-src="image.jpg" class="lazyload" />

赞助

感谢您的打赏~

打开支付宝扫一扫,即可进行扫码打赏哦~

版权声明 : 本文未使用任何知识共享协议授权,您可以任何形式自由转载或使用 / Article Is Not Licensed Under Any Creative Commons License, And You May Freely Reprint Or Use It In Any Form

 可能感兴趣的文章

伤心叹戈

评论区

发表评论 / 取消回复

必填

选填

选填

◎欢迎讨论,请在这里发表您的看法及观点。