微信小程序自定义遮盖层

<button bindtap="showview">Show</button>
<view class="bg" bindtap='hideview' style='display:{{display}}'></view>
<view class="show txt" style='display:{{display}}'>内容区</view>

.bg {
  display: none;
  position: absolute;
  top: 0%;
  left: 0%;
  width: 100%;
  height: 100%;
  background-color: black;
  z-index: 1001;
  -moz-opacity: 0.7;
  opacity: 0.70;
  filter: alpha(opacity=70);
}
 
.show {
  display: none;
  text-align: center;
  position: absolute;
  top: 45%;
  left: 20%;
  width: 53%;
  height: 10%;
  padding: 8px;
  border: 8px solid #e8e9f7;
  background-color: white;
  z-index: 1002;
  overflow: auto;
}
.txt{
  margin-top: 20rpx;
  font-size: 28rpx;
  color: royalblue
}

Page({
 
  data: {
    display: ''
  },

  onLoad: function(options) {

  },

//显示
  showview: function() {
    this.setData({
      display: "block"
    })
  },
//隐藏
  hideview: function() {
    this.setData({
      display: "none"
    })
  }

})