规则弹窗

laomenkuang_project/pages/index/index.js

@@ -5,6 +5,7 @@ const app = getApp()
 Page({
   data: {
     dataList:[],
+    showMask:false,//规则弹窗
   },
   //事件处理函数
   onLoad: function () {
@@ -31,5 +32,14 @@ Page({
       url: '../buyTicket/buyTicket?index=' + index
     })
   },
-
+  showRule:function(){//显示弹窗
+    this.setData({
+      showMask:true
+    })
+  },
+  hiddenRule:function(){//隐藏弹窗
+    this.setData({
+      showMask: false
+    })
+  }
 })

laomenkuang_project/pages/index/index.wxml

@@ -2,9 +2,8 @@
 <view class="container">
 
   <image class="buyBg" src="../images/buyBg.jpg"></image>
-  <!-- <swiper duration="500" next-margin="70rpx"> -->
-  <!-- <swiper duration="500">
-    
+  <image bindtap="showRule" class="ruleBtn" src="../images/rule.png"></image>
+  <!-- <swiper duration="500" next-margin="70rpx">
     <block wx:for="{{dataList}}" wx:key="*this">
       <swiper-item data-index="{{item.coupon_sell_id}}" bindtap="skipPage"> -->
         <view class="botCont" data-index="{{dataList.coupon_sell_id}}"  bindtap="skipPage">
@@ -22,4 +21,10 @@
     </block>
   </swiper> -->
   
+  <view class="maskAll" wx:if="{{showMask}}">
+    <view class="maskCont">
+      <image class="ruleMask" src="../images/ruleMask.png"></image>
+      <image bindtap="hiddenRule" class="hiddenIcon" src="../images/hiddenIcon.png"></image>
+    </view>
+  </view>
 </view>

laomenkuang_project/pages/index/index.wxss

@@ -77,4 +77,38 @@ page{
   font-family:SourceHanSansCN;
   font-weight:500;
   color:rgba(0,0,0,1);
+}
+
+.ruleBtn{
+  width: 117rpx;
+  height: 37rpx;
+  position: absolute;
+  right: 30rpx;
+  bottom: 485rpx;
+  z-index: 10;
+}
+.maskAll{
+  position: fixed;
+  width: 100%;
+  height: 100%;
+  top: 0;
+  left: 0;
+  background-color: rgba(0, 0, 0, 0.5);
+  z-index: 100
+}
+.ruleMask{
+  width: 576rpx;
+  height: 950rpx;
+}
+.hiddenIcon{
+  width: 110rpx;
+  height: 111rpx;
+  margin: -8rpx auto 0 auto;
+  display: block;
+}
+.maskCont{
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%,-50%);
 }