mui技术点02.双击header头部,画面回至顶部
做的项目若干画面页面展示数据很长,如想回到画面顶部需要用户手动划瓶到顶端,于是添加双击header头部,画面回至顶部的功能。
header上添加ID
开启双击事件
doubletap默认为关闭,如果是双击操作,需要开启;单击就不用了。
//mui初始化
mui.init({
gestureConfig:{
doubletap: true,
}
});
添加JS监听代码
添加到mui.plusReady()中。
//双击回到顶部
document.getElementById("header").addEventListener("tap",function(){
//mui.toast("doubletap");
//判断当前的视图的位置 如果滚动了,才能返回顶部
if(window.pageYOffset >= window.innerHeight){
mui.scrollTo(0,300);
}
})
画面最底端添加提示
双击标题栏,画面自动返回顶部呦!