右对齐:
class="span-price mui-pull-right"
块级按钮:
class="mui-btn mui-btn-block"
$是mui的别名
最简单的跳转某个页面
mui(function(){
var regTap = document.getElementById('reg');
regTap.addEventListener('tap',function(event){
console.log('点击了注册账号');
mui.openWindow({
url:'main.html',
id:'main'
});
});
});
导航条颜色
mui.init({
statusBarBackground: '#f7f7f7'
});
设置a标签链接字体颜色
.link-area a{
color: #C7C7CC;
}
去掉group这类的边框线
.mui-input-group:after,
.mui-input-group:before{
height: 0px;
}
设置全屏背景颜色
.mui-content{
position: absolute;
width: 100%;
height: 100%;
background-color: white;
}
通过id定位到控件
#l{
width: 70%;
}
页面滑动控制
<script src="js/mui.js"></script>
<script type="text/javascript">
mui.init();
mui('.mui-scroll-wrapper').scroll({
deceleration: 0.0006 //flick 减速系数,系数越大,滚动速度越慢,滚动距离越小,默认值0.0006
});
</script>
控件的显示与隐藏
var nav_right_btn = document.getElementById('changeUI');
nav_right_btn.classList.add('mui-hidden');//隐藏
nav_right_btn.classList.remove('mui-hidden');//显示
nav_right_btn.classList.add(‘mui-visibility’);//显示2
修改图片的大小
解决方法:把img标签的mui-media-object去掉,然后再用css改变图片大小
<img class="mui-pull-left" src="img/left_user.png" id="left_user_img">
#left_user_img{
width: 100px;
height: 100px;
}
图片叠加显示
<div id="login_logos_name">
<img src="img/login_bg_logo.png" id="login_bg_logo">
<img src="img/login_logo.png" id="login_logo">
<label id="login_name">登录</label>
</div>
#login_logos_name{
position: relative;//父视图必须
margin-top: 100px;
}
#login_bg_logo{
width: 100%;
height: 105px;
margin-top: 50px;
}
#login_logo{
top: 10px;//这里是top不是margin-top
left:50px;//top用了之后必须要补充left,相当于x,y
position: absolute;//子视图必须
width: 195px;
height: 55px;
}
iphoneX以上的安全区域颜色介绍
https://www.html.cn/archives/8224
延迟执行
setTimeout("testFunction()","6000"); 方法和毫秒
setInterval("testFunction()","6000");//每隔6000毫秒执行一次testFunction()函数,执行无数次。
varinterval = window.setInterval("testFunction()","6000");
window.clearInterval(interval); //停止执行setInterval循环。
当我们想让testFunction()函数每隔6000毫秒执行一次,执行10000毫秒后停止执行时,可以用两者三者结合使用来实现。
varinterval2 = window.setInterval("testFunction2()",6000);
setTimeout(function() {window.clearInterval(interval2);},10000);