1、问题：移动端出现弹窗后，滑动页面，页面底部出现空白

二、原因

经过分析，发现overflow: hidden;在移动端失效，导致弹窗出现时，滑动页面，页面底部出现空白。

三、解决

参考网址：https://www.jianshu.com/p/b241c4a4ec34

弹窗打开时给body元素设置position: fixed, 弹窗关闭时给body元素设置position: static。

四、移动端兼容性问题解决方案

参考网址：https://github.com/markyun/My-blog/issues/88

解决overflow: hidden在移动端失效问题的更多相关文章

  1. 解决overflow:hidden在安卓微信页面没有效果的办法

    在做h5移动端时候,发现overflow: hidden;在安卓微信页面失效问题,经研究和实验,用第三种方法和第四种方法可以解决! 1.完全隐藏 在<boby>里加入scroll=&quo ...

  2. overflow hidden 遇上absolute失效

    原文地址 背景 这几天开发的时候遇到了个问题,如图1. 写了个demo 由于页面并没有进行整体缩放,导致在小屏幕手机上显示会有异常.PM要求能够显示最后一个完整的标签. 当在iPhone5手机上查看页 ...

  3. 给元素设置overflow:hidden，pc端正常，但移动端依然可以滑动

    给设置overflow:hidden的元素设置position:fixed即可解决

  4. 利用float与overflow:hidden实现移动端两栏自适应布局

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. css ie7中overflow:hidden失效问题及解决方法

    css兼容ie7: 做页面的时候用负边距居中的时候在IE7下面,父节点中的overflow:hiden失效的问题,查阅了一些资料,总结一下解决方法. 问题原因: 当父元素的直接子元素或者下级子元素的样 ...

  6. 在ie7中overflow:hidden失效问题及解决方案

    css兼容ie7: 做页面的时候用负边距居中的时候在IE7下面,父节点中的overflow:hiden失效的问题,查阅了一些资料,总结一下解决方法. 问题原因: 当父元素的直接子元素或者下级子元素的样 ...

  7. IE6 Bug overflow:hidden失效

    下面就是我所收集或遇到的IE6 Bug之一:overflow:hidden失效 当父元素的直接子元素或者下级子元素的样式拥有position:relative属性时,父元素的overflow:hidd ...

  8. IE6、7下overflow:hidden失效的问题

    问题产生原因: 当父元素的直接子元素或者下级子元素的样式拥有position:relative或者position:absolute属性时,父元素的overflow:hidden属性就会失效. 例如: ...

  9. 解决 border-radius 元素在应用了 transform 的子元素 时overflow:hidden 失效的问题

    受大家启迪,于是最近深入研究了一下Css3中的一些属性.之中也是碰到了个不为我知的问题,在这里特此总结并与大家分享. 问题重现:在父元素上应用了 border-radius 的圆角属性.加上  ove ...

随机推荐

  1. ftp服务器使用-windowsftp服务起搭建

    首先打开控制面板选择程序 点击启动或关闭windows功能 勾选ftp服务器和IIS管理控制台点击确定 然后右键点击我的电脑,点击管理,然后点击本地用户和组,然后右键点击用户,点击新用户,创建一个用户 ...

  2. Spring Boot 集成 logback日志

    application.properties 配置logback.xml 路径注:如果logback.xml在默认的 src/main/resources 目录下则不需要配置application.p ...

  3. linux git 保存账号密码

    vi .git/config [credential] helper = store git pull 输入用户名.密码自动保存

  4. java 异步查询转同步多种实现方式：循环等待，CountDownLatch，Spring EventListener，超时处理和空循环性能优化

    异步转同步 业务需求 有些接口查询反馈结果是异步返回的,无法立刻获取查询结果. 正常处理逻辑 触发异步操作,然后传递一个唯一标识. 等到异步结果返回,根据传入的唯一标识,匹配此次结果. 如何转换为同步 ...

  5. 佳鑫：信息流广告CTR一样高，哪条文案转化率更好?

    在优化信息流广告的过程中,你有没有遇到这样的帐户? 投了几个AB方案,点击率好不容易上去了,但转化率还是有的高.有的低! 这儿就有这么一个为难的案例: 一个广告主计划向有意愿在北京预订酒店的用户投放信 ...

  6. 用360清理了一下电脑后发现Eclipse软件无法打开

    今天用360安全卫士清理了一下电脑,然后双击Eclipse软件发现不能打开,弹出以下界面: 解决方法如下: 打开计算机-属性-高级系统设置,修改系统变量里变量名为JAVA_HOME.CLASSPATH ...

  7. Django 命令

    django #安装: pip3 install django 添加环境变量 #1 创建project django-admin startproject mysite ---mysite ---se ...

  8. React条件渲染

    传参判断 class LoginControl extends React.Component { constructor(props) { super(props); this.handleLogi ...

  9. JS防抖与节流函数封装

    防抖 在监听scroll事件的时候经常会用到防抖,当滚动到某一位置而触发状态,从而不会出现频繁滚动持续触发事件的情况 防抖的事件处理机制仅触发一次且必须是结束状态下才会执行 function debo ...

  10. Excle批量导入到mysql调查

    1.使用navicat Premium 导入时候提示打不开.问题的链接如下: https://blog.csdn.net/wsyzxss/article/details/77864313 2.只能使用 ...