实现页面滚动效果:
首先html代码:
<div id="scroll1" class="mui-scroll-wrapper">
<div class="mui-scroll" style="background-color: #faf9f9;">
<ul class="mui-table-view">
<!--
<ion-content>
<ion-refresher pulling-text="下拉刷新" on-refresh="doRefresh()"></ion-refresher>
</ion-content> -->
<li class="mui-table-view-cell mui-table-view-cell-listoforder" ng-repeat="XXXX in transportlist" ng-click="XXXX(XXXX.transportNo)" >
<ul>
<li ng-bind="XXXX.timeToPlant" style="height:22px;font-style:normal;"></li>
<li ng-bind="XXXX.factoryAddress" style="height:22px"></li>
</ul>
</li>
</ul>
<div style="height:120px"></div>
</div>
红色部分为滚动的基本框架,中间为业务所需要的代码
js代码:
<script src="./js/mui.min.js"></script>
<script src="./js/mui.pullToRefresh.js"></script>
<script src="./js/mui.pullToRefresh.material.js"></script>
mui('.mui-scroll-wrapper').scroll({
deceleration: 0.0006 //flick 减速系数,系数越大,滚动速度越慢,滚动距离越小,默认值0.0006
});
mui框架的开发可以查阅http://dev.dcloud.net.cn/mui/ui/#scroll