码迷,mamicode.com
首页 > Web开发 > 详细

ajax+lazyload时lazyload失效问题及解决

时间:2020-01-19 22:34:55      阅读:151      评论:0      收藏:0      [点我收藏+]

标签:class   加载   UNC   列表   jquery   nta   信息   项目   失效   

最近写公司的项目的时候遇到一个关于图片加载的问题,所做的页面是一个商城的商品列表页,其中需要显示商品图片,名称等信息,因为商品列表可能会很长,所以其中图片需要滑到可以显示的区域再进行加载。
首先我的图片加载插件使用的是jquery的lazyload,
**一般情况下:**
使用lazyload,只需要引入相关文件(当然jquery也要提前引入)
<script src="../js/jquery.lazyload.js"></script>
然后在HTML的img标签中加入类名:lazy,图片的地址使用:data-original = “XXXXXXXXX”,最后再js中加上
$(function(){
    $("img.lazy").lazyload({
        effect: "fadeIn",
        container: $("#lazycontainer")
    }); 
})

这里设置了图片加载进来显示是渐现的效果,以及包裹整个商品列表的容器container

ajax+lazyload时lazyload失效问题及解决

标签:class   加载   UNC   列表   jquery   nta   信息   项目   失效   

原文地址:https://www.cnblogs.com/baimeishaoxia/p/12215711.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!