MUI-页面初始化
来源:互联网 发布:sql server 注释代码 编辑:程序博客网 时间:2024/04/28 15:55
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>
我们来看看效果如何:<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设置的。
好了。怎么样?第一天入门还不错吧。后面还有更多课程哦!
下载地址:http://download.csdn.net/detail/u013059555/8435811
0 0
- MUI-页面初始化
- MUI-页面初始化
- MUI框架学习之[页面初始化][创建子页面][打开新页面]
- mui.init 初始化参数
- webapp mui & HTML5+ (四) 之 窗口(页面初始化、跳转、传参)
- MUI-创建子页面
- HBuilder中的MUI页面
- mui 页面传参
- 手机页面框架 MUI
- mui 总页面
- mui页面间传值
- MUI-页面传参数
- MUI页面刷新
- mui 子页面回传值到父页面
- MUI之父页面刷新
- MUI之父页面刷新
- HTML5+和MUI页面操作
- MUI移动端页面跳转
- Java中Synchronized的使用方法
- AndroidStudio 中的一些快捷键
- 123123
- android Launcher——启动过程详解
- 第6章 进程的调度
- MUI-页面初始化
- android中的ListView数据量大时如何提高效率。。。。
- 以什么姿势进入DataMining会少走弯路?
- Codeforces Round #344 (Div. 2) C. Report
- MySql数据库查询多级部门及其下的所有用户信息
- android自定义View(2):实现百分比自适应布局
- 数组类
- Spring中ClassPathXmlApplicationContext类的简单使用
- Android Studio 报错原因以及解决办法