这个应该是最简单图片懒加载了吧
发布时间:2021-11-16 10:28:47
栏目:程序猿
阅读量:1813
作者:webcms
这个应该是最简单的懒加载方式了吧……
<script type="text/javascript">
/*懒加载*/
var isInitImg = false;
function initImg() {
if (isInitImg) {
return;
}
isInitImg = true;
$.each($('img'), function(i, item) {
var srcValue = $(item).attr('data-src');
if (srcValue) {
$(item).attr('src', srcValue);
}
});
}
$('document').ready(function() {
initImg();
});
// 某些firefox不触发dom ready
var str1 = 'set';
var str2 ='Time';
var runScript3 = str1 + str2+'out(function() {initImg();}, 1500)';
eval(runScript3);
</script>
说明: 在img标签里面添加自定义属性 data-src 在这个属性里面放图片的真实路径,比如:
<img src="" data-src="images/1.jpg" />
在页面有比较多或者比较大的图片或者可能会比较严重影响页面加载的图片上面使用这个。
上一篇:微信小程序轮播图添加链接
下一篇:css3 条纹背景滚动效果
评论: