一、页面header布局
<header class="mui-bar mui-bar-nav" id="backToTop">
<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
<h1 class="mui-title" >列表</h1>
<a id="add" class="mui-icon mui-icon-plusempty mui-pull-right" href="#addType">
<font size="3">添加</font>
</a>
</header>
二、js监听部分
一定需要包含至mui.plusReady()中
//双击回到顶部
document.getElementById("backToTop").addEventListener("doubletap",function(){
//判断当前的视图的位置 如果滚动了,才能返回顶部
if(window.pageYOffset >= window.innerHeight){
mui.scrollTo(0,300);
}
})
三、注意几点:
doubletap默认为关闭,如果是双击操作,需要开启。《官方mui事件api》
回至顶部最好追加当前位置的判断
window.pageYOffset >= window.innerHeight
如果是兼容android和ios,请看这边博客《MUI返回顶部功能》