关于微信小程序中自定义弹出层的代码

<!--custom Modal-->
  <view class="modal-mask" bindtap="hideModal" wx:if="{{showModal}}"></view>
  <view style='height:100%' wx:if="{{showModal}}">
    <view class="modal-content">
        <!--弹出层-->
        这是弹出层
    </view>
  </view>

/*弹出层开始*/
.modal-mask {
  width: 100%;
  height: 10%;
  position: fixed;
  top: 0;
  left: 0;
  background: #000;
  opacity: 0.5;
  overflow: hidden;
  z-index: 9000;
  color: #fff;
}

.modal-mask {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  background-color: #000;
  opacity: 0.5;
  overflow: hidden;
  z-index: 9000;
  color: #fff;
} .modal-content {
  position: fixed;
  top: 28%;
  left: 0;
  z-index: 9500;
  width: 95%;
  overflow: hidden;
  background: #fff;
  margin: 0 2.5%;
  <!--设定弹出层透明  这里关闭-->
  <!--background: rgba(0, 0, 0, 0)-->
}
/*弹出层结束*/


<!--在js中使用showModal控制弹出层的显示和隐藏-->
page({
	data:{
		showModal:true
	}
})