您现在的位置是：网站首页> 编程资料编程资料

微信小程序实现弹出层禁止页面滚动_javascript技巧_

2023-05-24 343人已围观

简介微信小程序实现弹出层禁止页面滚动_javascript技巧_

本文实例为大家分享了微信小程序实现弹出层禁止页面滚动的具体代码，供大家参考，具体内容如下

效果图

是否随页面滚动 catchtouchmove true开启 return关闭

.wxml

.wxss

page{   height: 160vh; } .modal{   width: 100%;   height: 100vh;   background: rgba(0, 0, 0, 0.6);   position: fixed;   top: 0;   left: 0;   z-index: 10;   display: flex;   justify-content: center;   align-items: center; } .modal>view{   width: 70%;   height: 500rpx;   background-color: #fff; }

.js

Page({   data: {     catchtouchmove:false,     modalName:false,   },   switch(){     this.setData({       catchtouchmove:!this.data.catchtouchmove     })   },   modal(){     this.setData({       modalName:!this.data.modalName     })   }, })

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。

您可能感兴趣的文章:

上一篇：vue+elementUI实现分页效果_vue.js_

下一篇：Vue3 计算属性的用法详解_vue.js_

您现在的位置是：网站首页> 编程资料编程资料

微信小程序实现弹出层禁止页面滚动_javascript技巧_

相关内容

点击排行

本栏推荐

猜你喜欢