微信小程序中遮罩层滚动穿透问题(view增加一个属性解决)

摘要:
直奔正题:遮罩层(蒙层)弹出的时候,不应该让遮罩层底下的内容能滚动,小程序中的最佳解决方案亲测如下:.container{background-color:#000000;position:fixed;top:0;opacity:0.6;100%;height:100%;z-index:3;}没错就是在遮罩层上加上catchtouchmove="ture",不需要控制任何class和样式等等。

直奔正题: 遮罩层(蒙层)弹出的时候,不应该让遮罩层底下的内容能滚动,小程序中的最佳解决方案亲测如下:

<view class="container"catchtouchmove="ture"></view>
.container {
    background-color: #000000;
    position: fixed;
    top: 0;
    opacity: 0.6;
     100%;
    height: 100%;
    z-index: 3;
}

没错就是在遮罩层上加上catchtouchmove="ture",不需要控制任何class和样式等等(因模拟器无touch事件,需在真机测试)。

免责声明:文章转载自《微信小程序中遮罩层滚动穿透问题(view增加一个属性解决)》仅用于学习参考。如对内容有疑问,请及时联系本站处理。

上篇Adblock Plus 规则浅析C#打印和C#打印预览的实现下篇

宿迁高防,2C2G15M,22元/月;香港BGP,2C5G5M,25元/月 雨云优惠码:MjYwNzM=

相关文章

企业微信的数据打通

前言 当企业使用企业微信营销时,会添加企业的相关公众号、微信小程序等应用,因此企业可以获取客户的unionid,做到数据打通。从而知道客户在企业的公众号、微信小程序中进行了哪些行为,进而可以了解用户的需求,给客户进行精准营销。那么企业是如何获取用户的unionid的呢? 一、如何理解unionid? 我们把每个接入微信的应用(公众号、APP)比作一个独立的...

微信小程序页面导航功能

页面导航功能无论是在app和web中都是一个极其常见的功能,如首字母导航,tabs导航等等。但是由于微信小程序无法都dom节点进行操作,所以怎么才能在小程序中快速的导航到用户的想要到达的地方呢。 那么下面我们就以A-Z的首字母导航来讲解一下吧! Step1 首先,当然我们需要简单写出我们的页面,右侧为我们A-Z的导航栏,中间显示主要的内容,当然我们这里也简...

微信小程序底部导航Tabbar

1,底部导航栏这个功能是非常常见的一个功能,基本上一个完成的app,都会存在一个导航栏,那么微信小程序的导航栏该怎么实现呢?经过无数的踩坑,终于实现了,好了,先看看效果图。 2,对于底部导航栏,小程序上给出的文档要求里面的item最少2个,最多五个。 3,在项目中找到app.json这个文件 { "pages":[ "pages/index/i...

小程序基础介绍

1.app.json 小程序的全局配置,包括了小程序的所有页面路径、界面表现、网络超时时间、底部 tab 等 @1、pages字段 —— 用于描述当前小程序所有页面路径,这是为了让微信客户端知道当前你的小程序页面定义在哪个目录。必填,pages填写之后默认生成page目录结构,首页读pages第一段定义 @2、window字段 —— 定义小程序所有页面的顶...

小程序开发-小程序页面间传递数据的方式

在小程序开发中,我们小程序的不同页面间经常需要传递一些数据。针对不同的数据要求,有几种不同的传递数据方式。 1. 页面跳转通过url传递数据 在使用wx.navigateTo或者wx.redirectTo的时候,可以将部分数据放在url里面,在新页面onLoad的时候获取且初始化。 //pageA.js // Navigate wx.navigateTo...

微信小程序:wx.request之post请求后端无法获取数据的问题

前言:小程序的开发中总是踩到各种坑,看文档也不知所云; 例如当我们在写微信小程序接口时,method请求方式有POST和GET两种,为了数据安全,我们会偏向于使用POST请求方式访问服务器端; 问题:当我们使用POST方式请求时,后端无法获取数据,但使用GET方式便可以获取数据?? 解决办法: 设置请求的 header: header: { "Conten...