jQuery图片延迟加载插件jQuery.lazyload
2023-08-30 您是第188位浏览者
使用方法引用jquery和jquery.lazyload.js到你的页面<script src="jquery-1.11.0.min.js"></script> <script src="jquery.lazyload.js?v=1.9.1"></script>html图片调用方法为图片加入样式lazy 图片路径引用方法用data-original<img cl
详细介绍
使用方法
引用jquery和jquery.lazyload.js到你的页面
<script src="jquery-1.11.0.min.js"></script> <script src="jquery.lazyload.js?v=1.9.1"></script>
html图片调用方法
为图片加入样式lazy 图片路径引用方法用data-original
<img class="lazy" data-original="img/bmw_m1_hood.jpg"> <img class="lazy" data-original="img/bmw_m1_side.jpg"> <img class="lazy" data-original="img/viper1.jpg"> <img class="lazy" data-original="img/viper_corner.jpg"> <img class="lazy" data-original="img/bmw_m3_gt.jpg"> <img class="lazy" data-original="img/corvette_pitstop.jpg">
js出始化lazyload并设置图片显示方式
<script type="text/javascript" charset="utf-8">
$(function() {
$("img.lazy").lazyload({effect: "fadeIn"});
});
</script>在图片中也可以不使用 class="lazy"，初始化时使用：
$("img").lazyload({effect: "fadeIn"});
这样就可以对全局的图片都有效！
