欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

微信小程序?qū)崿F(xiàn)一個自定義遮罩層效果

 更新時間:2023年09月08日 09:40:37   作者:與f  
這篇文章主要介紹了微信小程序?qū)崿F(xiàn)一個自定義遮罩層,大概效果是點擊按鈕Show顯示遮罩層,再次點擊屏幕任何地方隱藏遮罩層,本文結(jié)合實例代碼給大家介紹的非常詳細,需要的朋友可以參考下

正文:

先上效果圖: 點擊按鈕Show顯示遮罩層,再次點擊屏幕任何地方隱藏遮罩層;

<button bindtap="showview">Show</button>
<view class="bg" bindtap='hideview' style='display:{{display}}'></view>
<view class="show" bindtap='hideview' style='display:{{display}}'>申請成功
<view class='txt'>您的密碼為:123456</view>
</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:''
  },
  showview: function() { 
    this.setData({
      display: "block"
    })
  },
  hideview: function() {
    this.setData({
      display: "none"
    })
  }
})

到此這篇關(guān)于微信小程序?qū)崿F(xiàn)一個自定義遮罩層的文章就介紹到這了,更多相關(guān)小程序自定義遮罩層內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!

相關(guān)文章

最新評論