mui自定义底部弹框

底部弹框html(#app为页面样式，.tankuang为底部弹出框,.me为按钮)

<div id="app">
	<buttton class="me"></button>
</div>
<div class="tankuang">/div>

底部弹框样式css（一定要写position:fixed）

.tankuang{
	width: 100%;
	height:8.52rem;
	background: #FFFFFF;
	display: block;
	position: fixed;
	bottom: 0;
	border-top: 0.02rem solid #000;
	transform: translateY(100%);
	transition: transform .5s;
	z-index: 1000;
}
.show.tankuang{
	transform: translateY(0%);
}

通过用js加class名.show来控制底部弹框，当点击按钮式通过js加上class名，
js代码：（阻止冒泡，mask用的mui官网的遮罩层，点击#app处，弹框消失，遮罩层也消失）

window.onload=function(){
	var mask = mui.createMask(function(){
		document.getElementsByClassName('tankuang')[0].classList.remove('show'); 
	});
	mui('.me')[