Commit bd5c71f4 authored by hbcui1984's avatar hbcui1984

完善侧滑导航示例,隐藏进度提示框

parent 0d1943cf
...@@ -30,49 +30,51 @@ ...@@ -30,49 +30,51 @@
<div class="mui-content"> <div class="mui-content">
<div class="mui-content-padded"> <div class="mui-content-padded">
<h4 style="margin-top:10px;">mui</h4> <h4 style="margin-top:10px;">mui</h4>
<p > <p>
性能和体验的差距,一直是mobile app开发者放弃HTML5的首要原因。 浏览器天生的切页白屏、不忍直视的转页动画、浮动元素的抖动、无法流畅下拉刷新等问题,这些都让HTML5开发者倍感挫败 性能和体验的差距,一直是mobile app开发者放弃HTML5的首要原因。 浏览器天生的切页白屏、不忍直视的转页动画、浮动元素的抖动、无法流畅下拉刷新等问题,这些都让HTML5开发者倍感挫败 ; 另一方面,浏览器默认控件样式又少又丑,制作一个漂亮的控件非常麻烦,也有一些制作简单的ui框架但性能低下。
; 另一方面,浏览器默认控件样式又少又丑,制作一个漂亮的控件非常麻烦,也有一些制作简单的ui框架但性能低下。
</p> </p>
<p > <p>
mui框架有效的解决了这些问题,这是一个可以方便开发出高性能App的框架,也是目前最接近原生App效果的框架。 mui框架有效的解决了这些问题,这是一个可以方便开发出高性能App的框架,也是目前最接近原生App效果的框架。
</p> </p>
<h4>新手指南</h4> <h4>新手指南</h4>
<p> <p>
若想详细了解Hello MUI的源码及工作原理,可从<a href="http://www.dcloud.io">Dcloud官网</a>下载Hbuilder,选择新建“移动APP”,并选择“Hello MUI”工程模板,创建工程;然后通过数据线将手机连接上电脑,点击运行,就可以在手机上体验MUI的各项能力。 若想详细了解Hello MUI的源码及工作原理,可从<a href="http://www.dcloud.io">Dcloud官网</a>下载Hbuilder,选择新建“移动APP”,并选择“Hello MUI”工程模板,创建工程;然后通过数据线将手机连接上电脑,点击运行,就可以在手机上体验MUI的各项能力。
</p><p> </p>
若要使用MUI进行移动APP开发,可通过Hbuilder,新建“移动APP”,并选择“MUI”工程模板,该模板已内置MUI相关的资源文件。 <p>
若要使用MUI进行移动APP开发,可通过Hbuilder,新建“移动APP”,并选择“MUI”工程模板,该模板已内置MUI相关的资源文件。
</p> </p>
<p>更多详细介绍,请到<a href="http://dcloudio.github.io/mui">mui官网</a>查看;</p> <p>更多详细介绍,请到<a href="http://dcloudio.github.io/mui">mui官网</a>查看;</p>
<h4>版本介绍</h4> <h4>版本介绍</h4>
<p>当前版本为0.5.6,可到<a href="https://github.com/dcloudio/mui">Github</a>上获取最新版本。</p> <p>当前版本为0.5.6,可到<a href="https://github.com/dcloudio/mui">Github</a>上获取最新版本。</p>
<h4>License</h4> <h4>License</h4>
<p > <p>
mui遵循MIT License,源码已提交至Github,<a href="https://github.com/dcloudio/mui">点击查看</a>; mui遵循MIT License,源码已提交至Github,<a href="https://github.com/dcloudio/mui">点击查看</a>;
</p> </p>
</div> </div>
</div> </div>
<style type="text/css"> <style type="text/css">
p{ p {
text-indent: 22px; text-indent: 22px;
padding: 5px 8px; padding: 5px 8px;
} }
html,body,.mui-content{ html,
body,
.mui-content {
background-color: #fff; background-color: #fff;
} }
h4{ h4 {
margin-left: 5px; margin-left: 5px;
} }
</style> </style>
<script type="text/javascript" charset="utf-8"> <script type="text/javascript" charset="utf-8">
//处理点击事件,需要打开原生浏览器 //处理点击事件,需要打开原生浏览器
$('body').on('tap', 'a', function(e) { mui('body').on('tap', 'a', function(e) {
var href = this.getAttribute('href'); var href = this.getAttribute('href');
if (href) { if (href) {
if(window.plus){ if (window.plus) {
plus.runtime.openURL(href); plus.runtime.openURL(href);
}else{ } else {
location.href = href; location.href = href;
} }
} }
......
...@@ -135,8 +135,8 @@ ...@@ -135,8 +135,8 @@
width: '70%', width: '70%',
zindex: 9998 zindex: 9998
}, },
show:{ waiting:{
aniShow:'none' autoShow:false
} }
}); });
//初始化主页面位置 //初始化主页面位置
......
...@@ -132,8 +132,8 @@ ...@@ -132,8 +132,8 @@
width:'70%', width:'70%',
zindex: 9998 zindex: 9998
}, },
show:{ waiting:{
aniShow:'none' autoShow:false
} }
}); });
mui.currentWebview.setStyle({left:0}); mui.currentWebview.setStyle({left:0});
......
...@@ -85,7 +85,7 @@ ...@@ -85,7 +85,7 @@
// mui.plusReady(function(){ // mui.plusReady(function(){
// plus.webview.currentWebview().setStyle({bounce:'none'}); // plus.webview.currentWebview().setStyle({bounce:'none'});
// }); // });
$('.mui-content .mui-switch').each(function() {//循环所有toggle mui('.mui-content .mui-switch').each(function() {//循环所有toggle
//toggle.classList.contains('mui-active') 可识别该toggle的开关状态 //toggle.classList.contains('mui-active') 可识别该toggle的开关状态
this.parentNode.querySelector('span').innerText = '状态:' + (this.classList.contains('mui-active') ? 'true' : 'false'); this.parentNode.querySelector('span').innerText = '状态:' + (this.classList.contains('mui-active') ? 'true' : 'false');
/** /**
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment