iphone对fixed展现层中存在滚动内容支持非常不好, 尤其是背景页面产生滚动以后,输入控件就找不到了, 取消冒泡也不行,最后是这么解决的,可以参考

<style>
.modeldiv{
display:none;
position:absolute;
z-index:1000;
top:5%;
left:2rem;
right:2rem;
height:80%;
-moz-border-radius:1rem;
-webkit-border-radius:1rem;
border-radius:1rem;
overflow:hidden;
-webkit-overflow-scrolling:touch;
overflow-y:scroll;
-webkit-background-clip: padding-box;
background-clip: padding-box;
}
.ban_body{
height: 100%;
overflow: hidden;
}
</style> <div class="modeldiv">
<iframe src="" frameborder="0" style="width:100%;height:100%;"></iframe>
</div> <a href="void();" id="demo">弹出</a> <script>
$(function(){
$('#demo').on('click', function(){
$('.modeldiv').show();
//打开的时候给body添加样式
$("html,body").addClass("ban_body");
//关闭的时候移除样式
//$("html,body").removeClass("ban_body");
});
});
</script>

iphone对fixed模态框支持不太好,弹出窗口中滚动点击穿透的bug的更多相关文章

  1. 苹果手机iOS11中fixed弹出框中input光标错位问题

    最近遇到了一个移动前端的BUG:手机弹出框中的输入框focus时光标可能会错位. 刚开始时我完全不知道错误原因是什么,在电脑上调试时完全没有问题,手机上出现问题时也没有找到规律.后来在网上搜索了大量的 ...

  2. 在IOS11中position:fixed弹出框中的input出现光标错位的问题

    问题出现的背景: 在IOS11中position:fixed弹出框中的input出现光标错位的问题 解决方案 一.设计交互方面最好不要让弹窗中出现input输入框: 二.前端处理此兼容性的方案思路: ...

  3. Bootstrap 模态框(也可以说的弹出层)

    最近在尝试使用bootstrap的模态框 使用模态框主要要引入一下几个js和css: bootstrap.css jquery.1.9.1.js(这个可以灵活选择) bootstrap.js html ...

  4. div样式position:fixed,不随屏幕滚动而滚动,导致屏幕太小时弹出层被遮挡,无法滚动查看的解决办法

    window.onscroll = function () { var sl = -Math.max(document.body.scrollTop, document.documentElement ...

  5. IOS中position:fixed弹出框中的input出现光标错位的问题

    解决方案是 在弹框出现的时候给body添加fixed <style type="text/css"> body{ position: fixed; width: 100 ...

  6. iphone弹出窗口效果的制作(Core animation, CALayer)

    效果类似人人网微薄客户端的弹出效果 static CGFloat kTransitionDuration = 0.3; - (void)initView { UIWindow *window = [U ...

  7. centos 7 下vnc弹出窗口太小解决方法

    使用以下参数启动 : vncserver :2 -geometry 800x600

  8. iOS:模态弹出窗控制器UIPopoverPresentationController

    模态弹出窗控制器:UIPopoverPresentationController 实质:就是将内容控制器包装成PopoverPresentationController的形式,然后再模态出来,必须指定 ...

  9. 弹出视图/弹出模态presentViewController与presentModalViewController

    一.主要用途 弹出模态ViewController是IOS变成中很有用的一个技术,UIKit提供的一些专门用于模态显示的ViewController,如UIImagePickerController等 ...

随机推荐

  1. 十三、SAP中定义变量时赋初始值

    一.代码如下 二.输出如下

  2. 记录一次SQLServer 2019 MDS问题的排查

    问题表象: MDS网页里看不到任何建立的模型和实体. 用Excel add in连接,提示SQLServer授权过期. 但实际上SQLServer是企业版,目前并没有过期. 背景分析: 我们的环境是从 ...

  3. 计算方法执行完的耗时 c#

    Stopwatch watch = Stopwatch.StartNew(); //要执行的方法 test(); watch.Stop(); Console.WriteLine(string.Form ...

  4. 记录一次ajax使用

    function getSSOUrl(urlvalue) { var urls; $.ajax({ type: "GET", url: "../../GeoManage/ ...

  5. 操作系统类型&操作系统结构&现代操作系统基本特征

    五大类型操作系统 (1). 批处理操作系统 用户脱机使用计算机 用户提交作业之后直到获得结果之前就不再和计算机打交道. 作业提交的方式可以是直接交给计算中心的管理操作员,也可以是通过远程通讯线路提交. ...

  6. redis十-对快照模式分析

    复制自:http://www.cnblogs.com/huangxincheng/p/5010795.html 一:快照模式 或许在用Redis之初的时候,就听说过redis有两种持久化模式,第一种是 ...

  7. Java JDK for Windows

    目录 JDK简介下载安装配置JAVA_HOME和Path测试禁止Java自动更新(可选操作) JDK简介 JDK是Java语言的软件开发工具包,主要用于移动设备.嵌入式设备上的java应用程序.JDK ...

  8. 使用apply调用函数

    实现函数 calllt,调用之后满足如下条件1.返回的结果为调用fn之后的结果2.fn的调用为calllt的第一个参数之后的全部参数 方法1 使用es6 function calllt(...para ...

  9. Day 22:网络编程(3)

    TCP通讯协议特点:  1. tcp是基于IO流进行数据 的传输的,面向连接.  2. tcp进行数据传输的时候是没有大小限制的.  3. tcp是面向连接,通过三次握手的机制保证数据的完整性.可靠协 ...

  10. cf 525D.Arthur and Walls

    判断2*2的正方形,是不是3个"."1个"*"然后暴力bfs就好.(这种处理也是挺神奇的2333%%题解) #include<bits/stdc++.h& ...