代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<title></title>
<script src="../js/mui.min.js"></script>
<link href="../css/mui.min.css" rel="stylesheet" />
<script type="text/javascript" charset="UTF-8">
mui.init();
mui('.mui-scroll-wrapper').scroll({
bounce: false,
indicators: true, //是否显示滚动条
deceleration: 0.0006
});
</script>
<style type="text/css">
.mui-scroll-wrapper {
top: 10px;
height: 200px;
position: relative;
}
</style>
</head>
<body>
<header class="mui-bar mui-bar-nav">
<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
<h1 class="mui-title">标题</h1>
</header>
<nav class="mui-bar mui-bar-tab">
<a class="mui-tab-item mui-active">
<span class="mui-icon mui-icon-home"></span>
<span class="mui-tab-label">首页</span>
</a>
<a class="mui-tab-item">
<span class="mui-icon mui-icon-phone"></span>
<span class="mui-tab-label">电话</span>
</a>
<a class="mui-tab-item">
<span class="mui-icon mui-icon-email"></span>
<span class="mui-tab-label">邮件</span>
</a>
<a class="mui-tab-item">
<span class="mui-icon mui-icon-gear"></span>
<span class="mui-tab-label">设置</span>
</a>
</nav>
<div class="mui-content">
<h1>页面固定部分</h1>
<h1>页面固定部分</h1>
<h1>页面固定部分</h1>
<h1>页面固定部分</h1>
<h1>页面固定部分</h1>
<h1>页面固定部分</h1>
<h1>页面固定部分</h1>
<h1>页面固定部分</h1>
<h1>页面固定部分</h1>
<h1>页面固定部分</h1>
<div class="mui-scroll-wrapper">
<div class="mui-scroll">
<h1>局部滚动部分</h1>
<h1>局部滚动部分</h1>
<h1>局部滚动部分</h1>
<h1>局部滚动部分</h1>
<h1>局部滚动部分</h1>
<h1>局部滚动部分</h1>
<h1>局部滚动部分</h1>
<h1>局部滚动部分</h1>
<h1>局部滚动部分</h1>
<h1>局部滚动部分</h1>
<h1>局部滚动部分</h1>
<h1>局部滚动部分</h1>
</div>
</div>
</div>
</body>
</html>
整个页面可以实现有丑滚动条的滚动,但是局部滚动没效果,求解!
心然 (作者)
在第12行
···mui('.mui-scroll-wrapper').scroll({
bounce: false,
indicators: true, //是否显示滚动条
deceleration: 0.0006
});
···
2016-03-18 15:31
DCloud_UNI_FXY
回复 心然:js代码放到dom节点后边。或者放到mui.ready内部,你现在提前执行的时候dom还不存在。
2016-03-18 15:35
心然 (作者)
回复 DCloud_UNI_FXY:终于有效果了,谢谢!!!!
2016-03-18 15:41