介绍一个简单的案例，广告的弹出与关闭，页面如下：
image
点击×按钮，该页面删除
思路如下：
- 设置大view高宽为屏幕大小，fixed定位，透明居最外层，用isSuccess控制此view显示还是消失
- 设置里面的图片居中
- 简历一个小的view，给一个时间bindtap为close,当点击时，isSuccess从false转为true
<!--pages/home/home.wxml-->
<view class="girl" wx:if='{{isSuccess}}'>
<view bindtap="close">×</view>
<image src="https://s2.hdslb.com/bfs/static/blive/blfe-message-web/static/img/nodata.4d721f9d.png">
</image>
</view>
/* pages/home/home.wxss */
.girl{
width: 100vw;
height: 100vh;
display: flex;
justify-content: center;
align-items: center;
position: fixed;
top: 0;
left: 0;
background: rgba(0, 0, 0, 0.5);
z-index: 999;
}
.girl image{
width: 400rpx;
height: 300rpx;
}
.girl view{
width: 30rpx;
height: 30rpx;
line-height: 30rpx;
align-items: center;
border-radius: 50%;
background: #fff;
position: absolute;
right: 200rpx;
top: 200rpx;
}
// pages/home/home.js
Page({
del(e) {
close(){
this.setData({
isSuccess:false
})
},
/**
* 页面的初始数据
*/
data: {
isSuccess:true
}
})
