如上图，.fb-box是一个大div，包含着页面上的所有元素,包括所看到的那个弹窗.dialog-img，并且设置了height:100%;-webkit-overflow-scrolling:touch;

但是这样设置，在ios上会有一个bug,页面滚动一定的距离后，点击了显示弹窗，再关闭的话，就会发现，弹窗的一部分还“留在页面上”。定位需要，-webkit-overflow-scrolling:touch;也需要。

解决方案

把弹窗的div和.fb-box以兄弟节点的方式布局，在外层再弄一个div包住,这个坑就算爬起来了

ios上-webkit-overflow-scrolling与position的bug的更多相关文章

  1. ［ 面试没回答上的问题2］IOS上给body绑定click事件的bug

    面试被问到ios上的bug,自己提到绑定click事件的bug,但是并没有把问题讲的很清楚,这里再清理一下思路. 这个bug只在IOS上有,包括ihone,ipad,由于ios浏览器都用的safari ...

  2. IOS 浏览器上设置overflow: auto 不可滚动

    项目中最近遇到一个bug,在ios上出现的问题:原页面是在某一块地方滚动,但是改版后,滚动区域改为最外层元素,最外层包裹了一层class为main的div .main { position: fixe ...

  3. ios上position:fixed失效问题

    手机端上的猫腻真是多啊~~~ 此起彼伏! 最近又遇到了 固定定位的底部导航在ios上被弹出去 此时内心1w+个草泥马奔过~~~~~~~~ 直接上解决方案: <div class="ma ...

  4. 解决页面使用overflow: scroll，overflow-y:hidden在iOS上滑动卡顿的问题

    解决页面使用overflow: scroll,overflow-y:hidden在iOS上滑动卡顿的问题 div{ width: 100%; overflow-y: hidden; -webkit-o ...

  5. 适配android和iOS上position:absolute和input问题

    //适配android上absolute和input的问题var oHeight = $(document).height(); //屏幕当前的高度$(window).resize(function( ...

  6. IOS不支持overflow: hidden;

    IOS不支持overflow: hidden; 假设页面上有个弹出窗,弹出窗出现后,只想让用户的视觉锁定在弹出窗上,正常我们会想到用overflow:hidden这个属性来实现,如下 html{ ov ...

  7. javascript的onbeforeunload函数在IOS上运行

    今天在做项目的时候,组长让我用iPad测试一下前面写的离线缓存,后退不刷新页面,发现在iPad上onbeforeunload函数在iPad上一带而过,不运行??? 无奈之下,发现原来在IOS上,有自己 ...

  8. [开源]在iOS上实现Android风格的控件Toast

    [开源]在iOS上实现Android风格的控件Toast iOS的风格和Apple其他产品一样,简单而粗暴.没有给人其他选择的余地,让你又爱又恨.同样的,Apple对待iOS平台的开发人员和对待大众消 ...

  9. 纯css隐藏移动端滚动条解决方案（ios上流畅滑动）

    纯css隐藏移动端滚动条解决方案(ios上流畅滑动) html代码展示(直接复制代码保存至本地文件运行即可): <!DOCTYPE html> <html lang="en ...

  10. 解决ios、微信移动端的position: fixed; 支持性不好的问题 && 禁用下拉暴露黑底的功能

    解决ios.微信移动端的position: fixed; 支持性不好的问题 在chrome中的多个部分使用了position: fixed之后,都可以正常的布局,但是放在微信上却出现了不能正常显示的问 ...

随机推荐

  1. [Swift实际操作]七、常见概念-(3)尺寸CGSize的使用详解

    本文将为你演示CGSize的使用 首先导入需要使用到的两个框架 import UIKit import QuartzCore 定义一个尺寸对象,尺寸对象包含宽度和和高度两个参数.从右侧的结果可以看出, ...

  2. 【转】JMeter学习参数化User Defined Variables与User Parameters

    偶然发现JMeter中有两个元件(User Defined Variables与User Parameters)很相近,刚开始时我也没注意,两者有什么不同.使用时却发现两者使用场景有些不同,现在小结一 ...

  3. Spring JdbcTemplate源码阅读报告

    写在前面 spring一直以删繁就简为主旨,所以设计出非常流行的bean管理模式,简化了开发中的Bean的管理,少写了很多重复代码.而JdbcTemplate的设计更令人赞叹,轻量级,可做ORM也可如 ...

  4. (转)Windows下MySQL ：GUI安装和使用（MySQL GUI tools）

    原文:http://blog.csdn.net/dahunbi/article/details/52970815 MySQL GUI Tools是MySQL官方提供的图形化管理工具,功能很强大,值得推 ...

  5. chrome断点调试&&其他技巧

    chrome断点调试 1. 在编写JavaScript代码时,如果 出现了bug,就要不断的去找错误,如果console控制台中提示还好说,可是没有提示恐怕就要费一番周折了.但是有了chrome这个浏 ...

  6. python 代码的缩进位置决定执行部分

    通过近期的代码训练,我发现同样的一个语句,在同一行缩进的位置不同,决定的执行部分也不同.先给一个例子(我想打出1-100中的前20个偶数) 比较第一张图和第二张图.第一张截图实现了我想要的功能.可是当 ...

  7. addEventListener和attachEvent的区别 分类： JavaScript 2015-05-12 19:03 702人阅读 评论(0) 收藏

    addEventListener共有3个参数,如下所示:element.addEventListener(type,listener,useCapture); 参数 参数说明 element 要绑定事 ...

  8. Chapter 3 Phenomenon——14

    They wheeled me away then, to X-ray my head. 他们把我移到了一边用X光照射我的头. 他们把我放到轮椅上,推着我去做头部X光检查. I told them t ...

  9. jQuery为图片添加链接(创建新的元素来包裹选中的元素)

    主要用到 wrap()函数 http://www.w3school.com.cn/jquery/manipulation_wrap.asp 这个函数是创建新的的元素去包裹所执行这个方法的元素 如下例子 ...

  10. .Net Core全球化多语言

    参照:ASP.NET Core 全球化和本地化 步骤如下: 后台中的本地化. Startup.cs中注册服务并制定Resource文件的位置.注意:这里的位置不仅仅应用到Web层,如Infrastru ...