MUI-页面初始化

mui框架将很多功能配置都集中在mui.init方法中,要使用某项功能,只需要在mui.init方法中完成对应参数配置即可,目前支持在mui.init方法中配置的功能包括:创建子页面关闭页面手势事件配置预加载下拉刷新上拉加载

这里说明一下。在没有webview的情况下,有些事情是无法处理的,比如手势事件、预加载、创建子页面等。

这里我们以手势事件为例:

<!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="../DKSHDemo/Resource/js/mui.min.js"></script>
		<link href="../DKSHDemo/Resource/css/mui.min.css" rel="stylesheet" />
		<script type="text/javascript" charset="utf-8">
			mui.init({
		      		 gestureConfig:{
		             tap: true,        //默认为true
		             doubletap: true,  //默认为false
		             longtap: false,    //默认为false
		             swipe: true,      //默认为true
		             drag: true,       //默认为true
		             hold:false,       //默认为false,不监听
		            release:false      //默认为false,不监听
		  }
		         });
		</script> 
		<style>
		    body{position: relative;}
			.mui-btn{width:80%; margin: 0 auto; margin-top: 10px; margin-left: 10%;}
		</style>
	</head>
	<body>
		<button type="button" id="tap" class='mui-btn mui-btn-positive '>tap事件</button>
		<button type="button" id="doubletap" class='mui-btn mui-btn-positive '>doubletap事件</button>
		<button type="button" id="longtap" class='mui-btn mui-btn-positive '>longtap事件</button>
	    <button type="button" id="swipe" class='mui-btn mui-btn-positive '>swipe事件</button>
	</body>

</html>
<script>
	document.getElementById("tap").addEventListener("tap",function(){
		alert("tap事件支持");
	})
	document.getElementById("doubletap").addEventListener("doubletap",function(){
		alert("doubletap事件支持");
	})
	document.getElementById("longtap").addEventListener("longtap",function(){
		alert("longtap事件支持");
	})
	document.getElementById("swipe").addEventListener("swiperight",function(){
		alert("swipe事件支持");
	})
</script>

我们来看看效果如何:



从上面的运行结果我们可以看到,在init中注册的手势有的支持有的则不支持。这是

有我们在init设置的。

MUI-页面初始化_第1张图片MUI-页面初始化_第2张图片


好了。怎么样?第一天入门还不错吧。后面还有更多课程哦!


下载地址:http://download.csdn.net/detail/u013059555/8435811


你可能感兴趣的:(init,手势,MUI)