<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<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">
<title>首页</title>
<link rel="stylesheet" href="../css/mui.min.css">
<link rel="stylesheet" href="../css/common.css"/>
<!--<script src="../js/jquery-1.3.2.min.js"></script>-->
<script src="../js/mui.min.js"></script>
<script src="../js/app.js"></script>
</head>
<body>
<div class="mui-content" id="refcontent">
<div id="sliders">
<div id="slider" class="mui-slider">
<div class="mui-slider-group mui-slider-loop">
<div class="mui-slider-item mui-slider-item-duplicate">
<a href="Individual-Center.html">
<img src="../images/yuantiao.jpg">
<p class="mui-slider-title">静静看这世界</p>
</a>
</div>
<div class="mui-slider-item">
<a href="#">
<img src="../images/shuijiao.jpg">
<p class="mui-slider-title">幸福就是可以一起睡觉</p>
</a>
</div>
<div class="mui-slider-item">
<a href="#">
<img src="../images/muwu.jpg">
<p class="mui-slider-title">想要一间这样的木屋,静静的喝咖啡</p>
</a>
</div>
<div class="mui-slider-item">
<a href="#">
<img src="../images/cbd.jpg">
<p class="mui-slider-title">Color of SIP CBD</p>
</a>
</div>
<div class="mui-slider-item">
<a href="#">
<img src="../images/yuantiao.jpg">
<p class="mui-slider-title">静静看这世界</p>
</a>
</div>
<div class="mui-slider-item mui-slider-item-duplicate">
<a href="#">
<img src="../images/shuijiao.jpg">
<p class="mui-slider-title">幸福就是可以一起睡觉</p>
</a>
</div>
</div>
<div class="mui-slider-indicator mui-text-right">
<div class="mui-indicator mui-active"></div>
<div class="mui-indicator"></div>
<div class="mui-indicator"></div>
<div class="mui-indicator"></div>
</div>
</div>
</div>
<div class="title">最新活动</div>
<ul id="Match" class="mui-table-view mui-grid-view"></ul>
<div class="title">最新资讯</div>
<ul id="News" class="mui-table-view"></ul>
</div>
<script type="text/javascript" charset="utf-8">
var slider = mui("#slider");
slider.slider({
interval: 5000
});
mui.init({
swipeBack: false,
pullRefresh: {
container: '#refcontent',
down: {
callback: pullRef
}
}
});
/**
* 加载具体业务实现
*/
function pullRef() {
//ajax();
setTimeout(mui('#refcontent').pullRefresh().endPulldownToRefresh(),1500);
}
//上拉函数
function pullupRefresh()
{
mui('#pullrefresh').pullRefresh().endPullupToRefresh(true); //参数为true代表没有更多数据了。
}
</script>
</body>
</body>
</html>
4 个回复
爱已成歌
我也遇到这个问题了。
下拉刷新控件和图片轮播控件不能一起用,不然图片就显示不出来。
从左往右划的时候,有一张可以显示一下,不过立即就消失了。
望官方能尽快解决这个问题,这个需求太平常和太频繁了
爱已成歌
我发现去掉 mui-slider-loop 这个class 以后,图片就显示正常了。
可能是官方通过mui-slider-loop这个class去操作图片轮播的时候出问题了。官方要赶紧解决下啊。。。
楼主现在可以暂时去掉这个自动轮播的属性,代之以代码方式来轮播应该就可以了。
如:
<!--下拉刷新容器-->
<div id="refreshContainer" class="mui-content mui-scroll-wrapper">
<div class="mui-scroll mui-slider">
<!--数据列表-->
<div class="mui-slider-group">
<div class="mui-slider-item mui-slider-item-duplicate">
...
爱已成歌
抱歉,修正下,这样做只能保证首屏正确,其他的图片还是不能轮播。官方要给力啊。。。
2015-04-04 20:35
爱已成歌
抱歉,修正下,这样做只能保证首屏正确,其他的图片还是不能轮播。官方要给力啊。。。
爱已成歌
官方已经给出了临时解决办法。
http://ask.dcloud.net.cn/question/4098