<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title>懒加载</title> <style type="text/css"> img{ width: 100%; } .lazy { display: none; } *{ margin:0; padding:0; } </style> </head> <body> <img class="lazy" src="http://baojia.xcabc.com/Img/che.jpg" data-original="http://img2.xcabc.com/201602/24/20160224104550126170.jpg"> <img class="lazy" src="http://baojia.xcabc.com/Img/che.jpg" data-original="http://img2.xcabc.com/201602/24/20160224105947314395.jpg"> <img class="lazy" src="http://baojia.xcabc.com/Img/che.jpg" data-original="http://img2.xcabc.com/201602/23/20160223112746730251.jpg"> <img class="lazy" src="http://baojia.xcabc.com/Img/che.jpg" data-original="http://img2.xcabc.com/201602/23/20160223032741967501.jpg"> <img class="lazy" src="http://baojia.xcabc.com/Img/che.jpg" data-original="http://img2.xcabc.com/201602/22/20160222033731736661.jpg"> <script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script> <script type="text/javascript" src="http://apps.bdimg.com/libs/jquery-lazyload/1.9.5/jquery.lazyload.min.js"></script> <script type="text/javascript"> $("img.lazy").show().lazyload({ threshold : 200 }); </script> </body> </html> 提示:你可以先修改部分代码再运行。 转载请注明:有爱前端 » lazyload 懒加载 喜欢 (2)or分享 (0)