使用下拉刷新组件和图片懒加载,导致页面需要进行懒加载的图片无法显示
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Hello MUI</title>
<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<!--标准mui.css-->
<link rel="stylesheet" href="../../resources/css/mui.min.css">
<!--icons-extra.css-->
<link rel="stylesheet" type="text/css" href="../../resources/css/icons-extra.css" />
<!--App自定义的css-->
<link rel="stylesheet" type="text/css" href="../../resources/css/app.css"/>
<style>
.mui-table-view.mui-grid-view .mui-table-view-cell .mui-media-body{
font-size: 16px;
margin-top:8px;
color: #333;
}
.mui-content .mui-card{
margin-top: 15px;
border-radius: 15px;
}
.mui-content .mui-card:first-child{
margin-top: 10px;
}
.mui-card{
margin:0px;
}
/*.mui-scroll-wrapper{
position:inherit;
overflow: auto;
}
.mui-scroll-wrapper .mui-scroll{
position:inherit;
}*/
</style>
</head>
<body>
<div class="mui-content mui-scroll-wrapper">
<div class="mui-scroll">
<div class="mui-card">
<div class="mui-card-header">
<a class="mui-icon-extra mui-icon-extra-rank mui-pull-left" style="color:#FF9900">
</a>
<span>
排行榜
</span>
<a class="mui-icon mui-icon-arrowright mui-pull-right"></a>
</div>
<div class="mui-card-content">
<ul class="mui-table-view mui-grid-view">
<li class="mui-table-view-cell mui-media mui-col-xs-6">
<a href="#">
<img class="mui-media-object" src="../../resources/images/shuijiao.jpg">
<div class="mui-media-body">幸福就是可以一起睡觉</div></a></li>
<li class="mui-table-view-cell mui-media mui-col-xs-6">
<a href="#">
<img class="mui-media-object" src="../../resources/images/muwu.jpg">
<div class="mui-media-body">想要一间这样的木屋,静静的喝咖啡</div></a></li>
<li class="mui-table-view-cell mui-media mui-col-xs-6">
<a href="#"><img class="mui-media-object" src="../../resources/images/cbd.jpg">
<div class="mui-media-body">Color of SIP CBD</div></a></li>
<li class="mui-table-view-cell mui-media mui-col-xs-6">
<a href="#">
<img class="mui-media-object" src="../../resources/images/yuantiao.jpg">
<div class="mui-media-body">静静看这世界</div></a></li>
</ul>
</div>
</div>
<div class="mui-card">
<div class="mui-card-header">
<a class="mui-icon-extra mui-icon-extra-dictionary mui-pull-left" style="color:#FF9900">
</a>
<span>
图文
</span>
<a class="mui-icon mui-icon-arrowright mui-pull-right"></a>
</div>
<div class="mui-card-content">
<ul class="mui-table-view">
<li class="mui-table-view-cell mui-media">
<a href="javascript:;">
<img class="mui-media-object mui-pull-left" data-lazyload="../../resources/images/shuijiao.jpg">
<div class="mui-media-body">
幸福
<p class="mui-ellipsis">能和心爱的人一起睡觉,是件幸福的事情;可是,打呼噜怎么办?</p>
</div>
</a>
</li>
<li class="mui-table-view-cell mui-media">
<a href="javascript:;">
<img class="mui-media-object mui-pull-left" data-lazyload="../../resources/images/muwu.jpg">
<div class="mui-media-body">
木屋
<p class="mui-ellipsis">想要这样一间小木屋,夏天挫冰吃瓜,冬天围炉取暖.</p>
</div>
</a>
</li>
<li class="mui-table-view-cell mui-media">
<a href="javascript:;">
<img class="mui-media-object mui-pull-left" data-lazyload="../../resources/images/yuantiao.jpg">
<div class="mui-media-body">
CBD
<p class="mui-ellipsis">烤炉模式的城,到黄昏,如同打翻的调色盘一般.</p>
</div>
</a>
</li>
<li class="mui-table-view-cell mui-media">
<a href="javascript:;">
<img class="mui-media-object mui-pull-left" data-lazyload="http://www.dcloud.io/hellomui/images/3.jpg">
<div class="mui-media-body">
CBD11
<p class="mui-ellipsis">烤炉模式的城,到黄昏,如同打翻的调色盘一般.</p>
</div>
</a>
</li>
<li class="mui-table-view-cell mui-media">
<a href="javascript:;">
<img class="mui-media-object mui-pull-left" data-lazyload="http://www.dcloud.io/hellomui/images/4.jpg">
<div class="mui-media-body">
CBD
<p class="mui-ellipsis">烤炉模式的城,到黄昏,如同打翻的调色盘一般.</p>
</div>
</a>
</li>
<li class="mui-table-view-cell mui-media">
<a href="javascript:;">
<img class="mui-media-object mui-pull-left" data-lazyload="http://www.dcloud.io/hellomui/images/3.jpg">
<div class="mui-media-body">
CBD
<p class="mui-ellipsis">烤炉模式的城,到黄昏,如同打翻的调色盘一般.</p>
</div>
</a>
</li>
<li class="mui-table-view-cell mui-media">
<a href="javascript:;">
<img class="mui-media-object mui-pull-left" data-lazyload="http://www.dcloud.io/hellomui/images/2.jpg">
<div class="mui-media-body">
CBD
<p class="mui-ellipsis">烤炉模式的城,到黄昏,如同打翻的调色盘一般.</p>
</div>
</a>
</li>
<li class="mui-table-view-cell mui-media">
<a href="javascript:;">
<img class="mui-media-object mui-pull-left" data-lazyload="http://www.dcloud.io/hellomui/images/1.jpg">
<div class="mui-media-body">
CBD
<p class="mui-ellipsis">烤炉模式的城,到黄昏,如同打翻的调色盘一般.</p>
</div>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</body>
<script src="../../resources/js/mui.min.js"></script>
<script src="../../resources/js/mui.lazyload.js"></script>
<script src="../../resources/js/mui.lazyload.img.js"></script>
<script>
mui.init();
(function($) {
//图片懒加载
$(document).imageLazyload({
placeholder: '../../resources/images/60x60.gif'
});
})(mui);
</script>
</html>