vue阻止弹窗_vue 弹窗禁止底层滚动

2023-11-11

原因:底层视图高度超出百分百,加入弹窗后再苹果浏览器隐藏上下栏的情况下遮罩层没有完全遮住底层。

处理:打开弹窗后禁止底层滚动调用stop事件,关闭则开启底层滚动调用move事件。

let mo=function(e){e.preventDefault();};

stop(){

document.body.style.overflow='hidden';

document.body.style.position='fixed';

document.body.style.width='100%';

document.addEventListener("touchmove",mo,false);//禁止页面滑动

},

move(){

document.body.style.overflow='';//出现滚动条

document.body.style.position='initial';

document.body.style.height='1006px';

document.removeEventListener("touchmove",mo,false);

},

参考相关来源:

https://www.cnblogs.com/fanbi/p/9648184.html

https://blog.csdn.net/m0_37852904/article/details/79300719

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

vue阻止弹窗_vue 弹窗禁止底层滚动 的相关文章

  • envi的纹理特征统计量_数据特征的选取

    图像特征的提取和选择是图像处理过程中很重要的环节 对后续图像分类有着重要的影响 并且对于图像数据具有样本少 维数高的特点 要从图像中提取有用的信息 必须对图像特征进行降维处理 特征提取与特征选择就是最有效的降维方法 其目的是得到一个反映数据
  • STM32学习笔记:gps两种解码的方式

    做为现在的物联网行业 手持设备中 缺少不了的就是GPS定位功能 GPS模块和STM32的串口进行通信 将GPS的数据发送给M3的串口 由M3进行GPS协议的解码 解析出来后保存在响应的结构体中 在进行显示 这里分别介绍2中解析协议的方法 第
  • 数据中心网络的电路交换域

    buffer 的意义在用带宽平滑统计突发 流量波动越大 统计复用能效越高 假设没有 buffer 将大量溢出和空载并存 但如果流量是可预期的 也可以转向相反的方向 比如虚电路 数据中心与 Internet 不同 流量类型相对固定 典型的如
  • java封装与继承

    封 装 防止用户在main 方法中设置错误变量数值 因此采用private关键字封装 私有化后主函数将无法直接调用被private定义的属性 方法 构造器和内部类 体现 私有化 private 后 因无法直接调用 所以将提供公共 publi
  • kNN处理iris数据集-使用交叉验证方法确定最优 k 值

    基本流程 1 计算测试实例到所有训练集实例的距离 2 对所有的距离进行排序 找到k个最近的邻居 3 对k个近邻对应的结果进行合并 再排序 返回出现次数最多的那个结果 交叉验证 对每一个k 使用验证集计算 记录k对应的错误次数 取错误数最小的
  • python 批量创建文件夹

    批量创建文件夹 文件夹的名称如果在一个excel中 那就先获取excel中的数据 转成list 获取这个excel中的某一列的数据 使用pandas的情况注意数据格式是Dateframe 转成list import pandas as pd
  • 【Kubernetes系列】工作负载资源之Deployment

    文章目录 概述 Deployment用例 创建 Deployment Deployment 状态 更新 Deployment 回滚 Deployment Deployment 规约 Pod 模板 副本 选择算符 策略 进度期限秒数 最短就绪
  • java为什么还有基本数据类型

    Java既然是面向对象的 宣称一切都是对象 那为什么还有基础类型 基本数据类型是用的最频繁的类型 而且占用存储空间小 可以把它们存入栈中 实现快速的操作 而他们的封装类Integer等 必需创建实例 在堆中开辟内存 既消耗资源 又耗费时间
  • gitolite安装及配置教程centos7

    1 安装依赖包 yum install curl devel expat devel gettext devel openssl devel zlib devel perl devel y 2 安装 Git yum y install gi
  • linux编译命令——make -j8

    项目越来越大 每次需要重新编译整个项目都是一件很浪费时间的事情 Research了一下 找到以下可以帮助提高速度的方法 总结一下 1 tmpfs 有人说在Windows下用了RAMDisk把一个项目编译时间从4 5小时减少到了5分钟 也许这
  • 小知识点记录:(“字符“).equals(str)与str.equals(“字符“)的区别

    最近遇到这个知识点 字符 equals str 和 str equals 字符 的区别 之前比较常用 字符 equals str 但还是仔细区分一下 因为 如果传入的字符串str为null时 null的的引用类型变量来调用方法会抛出异常 先
  • 架构师成长之路-docker 搭建kibana可视化平台操作es索引

    什么是kibana Kibana 是一款免费开源的前端应用程序 其基础是 Elastic Stack 可以为 Elasticsearch 中索引的数据提供搜索和数据可视化功能 官方术语可以理解操作es的一个可视化工具 es封装了接口 而ki
  • 缺席一年后,谷歌I/O大会回来了!3D视频聊天,10倍性能TPU,还有Android 12重磅登场!...

    新智元报道 来源 Google Blog 编辑 yaxin 好困 新智元导读 5月19日凌晨1点 谷歌IO 2021开发者大会重新回归 谷歌可谓是厚积薄发 积攒2年创新技术轮番轰炸 3D视频聊天Starline 十倍性能TPU V4 聊天不
  • 浅谈小程序开源业务架构建设之路

    一 业务介绍 1 1 小程序开源整体介绍 百度从做智能小程序的第一天开始就打造真正开源开放的生态 我们的愿景是 定义移动时代最佳体验 建设智能小程序行业标准 打破孤岛 共建开源 开放 繁荣的小程序行业生态 百度智能小程序的生态玩家有三类 分
  • Java和Python读取文件总结

    public static ArrayList
  • 紫光电子档案管理系统存在SQL注入漏洞(漏洞复现)

    文章目录 紫光电子档案管理系统存在SQL注入漏洞 漏洞复现 0x01 前言 0x02 漏洞描述 0x03 影响范围 0x04 漏洞环境 0x05 漏洞复现 1 访问漏洞环境 2 构造POC 3 复现 紫光电子档案管理系统存在SQL注入漏洞
  • VMware如何导出和导入OVF文件

    开源虚拟化格式 OVF文件 是一种开源的文件规范 是一种开源 安全 有效 可拓展的便携式虚拟打包格式 由ovf文件 mf文件 cert文件 vmdk文件和iso文件等组成 可以用于虚拟机在不同虚拟化平台上的迁移 本文介绍VMware如何导出
  • Windows10访问共享总是提示输入网络凭证不正确

    场景 安装了windows10系统后 访问共享时总是提示输入网络凭证 输入什么都提示不正确 被访问机也是windows 10 操作系统 使用windows7不需要输入密码就可以访问 即使在被访问机上增加新的用户或者用guest账号去登录也会
  • GB9706.1-2007名词解释:电压

    电压 1 高电压 任何超过 1000V 交流或 1500V 直流或 1500V 峰值的电压 2 网电源电压 多相供电网中两相线之间的电压 或单相供电网中相线与中性线之间的电压 3 安全特低电压 在用安全特低电压变压器或等效隔离程度的装置与供

随机推荐

  • typora

    关于typora的一篇博客 https blog csdn net mingzhuo 126 article details 79941450
  • faceswap使用记录

    1 没有显示 fs cache文件夹 当时我是使用云gpu来运行文件代码的 里面提示我安装两个配置文件放置到 fs cache文件夹 但是当前文件夹里面并没有显示 fa cache文件夹 虽然不知道是什么原因 但这个文件夹其实是存在的 你下
  • java读取文件的方法是_java读取文件的方法有几种

    java读取文件的方法有几种 发布时间 2020 06 26 14 56 33 来源 亿速云 阅读 104 作者 Leah 这篇文章将为大家详细讲解有关java读取文件的方法 文章内容质量较高 因此小编分享给大家做个参考 希望大家阅读完这篇
  • 【python】Counter 函数的用法

    https docs python org 3 6 library collections html collections Counter 原文链接 https blog csdn net u010339879 article detai
  • 使用CocosBuilder2.1结合cocos2d-x2.0.3创建动画场景

    原文地址 http article ityran com archives 2140 本为由泰然教程组成员 浅底 原创 作为一位经验丰富的游戏开发人员 这次浅底将CocosBuilder经验分享给大家 希望大家喜欢 欢迎拍砖 转载请注明出处
  • yolov5加入CBAM,SE,CA,ECA注意力机制,纯代码(22.3.1还更新)

    本文所涉及到的yolov5网络为5 0版本 后续有需求会更新6 0版本 CBAM注意力 class ChannelAttention nn Module def init self in planes ratio 16 super Chan
  • 答辩准备细节 - 推荐第三本书很棒的书

    之前介绍了 PPT演讲力 重要时刻 不要输在表达上 和 金字塔原理 本次准备来介绍一本非常好的设计书 写给大家看的设计书 01 设计的必要性 写简历 做PPT等都可以用到 我们虽然不是专门的设计人员 但是我们仍然可以追求内容更好看 人们对于
  • XDOJ寻找最长的行

    寻找最长的行 类别 字符串 时间限制 1S 内存限制 1000Kb 问题描述 寻找若干行文本中最长的一行 输入说明 输入为多个字符串 每个字符串长度不超过100个字符 每个字符串占一行 输入的行为 end 时表示输入结束 输出说明 输出其中
  • Elasticsearch 实现分组统计

    之前有个查询es分组求和的需求 类似关系型数据库 select a b sum c from table group by a b 当时用DSL查询语句实现 这边记录下 GET my index my type search from 0
  • C++中new与delete问题学习

    C 中new与delete问题学习 一 new char与delete问题 1 问题程序 include
  • 普歌-云言团队-Spring的AOP简介

    什么是AOP AOP 为 Aspect Oriented Programming 的缩写 意思为面向切面编程 是通过预编译方式和运行期动态代理实现程序功能的统一维护的一种技术 AOP 是 OOP 的延续 是软件开发中的一个热点 也是Spri
  • 【ES实战】索引mapping的动态设置

    动态mapping 文章目录 动态mapping 动态mapping规则 语法规则 match mapping type match and unmatch match pattern path match and path unmatch
  • signature=8a03839902ac8eb66fcf33ab62032d86,swch-20200612

    0001710583 20 000020 txt 20200618 0001710583 20 000020 hdr sgml 20200618 20200618161953 ACCESSION NUMBER 0001710583 20 0
  • 了解Nginx配置文件结构与配置上下文

    提供 ZStack云计算 系列教程 本教程为如何在Ubuntu 14 04上实现Nginx与LEMP系列四篇中的第四篇 内容介绍 Nginx是一套高性能Web服务器 负责处理互联网上各大型站点的日常负载 其特别擅长处理高并发连接与大量静态内
  • c++语法

    文章目录 0 0 编译运行 单个程序编辑调试 库文件编译调试 1 变量 1 1 变量的声明和定义 1 2 变量的作用域 1 3 namespace命名空间 标准空间std 2 关键字 2 1 extern 3 常量 1 define 定义
  • 插值1算法

    一 基本概念 插值是指通过对数据进行线性 非线性或其他类型的逼近 将一组离散数据映射到连续的函数值 在数学中 插值通常用于将数据点连接起来 以形成连续的函数图像 特别是在数值计算和图像处理中 插值可以用于在空间中预测对象的位置 速度和加速度
  • Unity&Shader案例篇—绘制雨滴

    一 前言 转载请注明出处凯尔八阿哥专栏 惯例先上效果图 本文不只是简单的绘制雨滴 同时处理了摄像机不同朝向看到的雨滴下落的方向也不一样 二 方法 1 绘制雨线 绘制雨使用的是C 脚本绘制的 脚本为 using UnityEngine usi
  • 测试之自动化测试

    详细Python教程见 http www liaoxuefeng com wiki 0014316089557264a6b348958f449949df42a6d3a2e542c000 0014316090478912dab2a3a9e8f
  • 【金九银十】软件测试中的高频面试题梳理(内附答案)

    写数据库语句 一个老师表 一个学生表 1 查李老师班的小明 2 并将小明的年纪改成26 select t1 from 学生表 t1 jion 老师表 t2 on t1 班级 t2 班级 where t1 姓名 小明 and t2 姓名 李老
  • vue阻止弹窗_vue 弹窗禁止底层滚动

    原因 底层视图高度超出百分百 加入弹窗后再苹果浏览器隐藏上下栏的情况下遮罩层没有完全遮住底层 处理 打开弹窗后禁止底层滚动调用stop事件 关闭则开启底层滚动调用move事件 let mo function e e preventDefau