iphone对fixed模态框支持不太好,弹出窗口中滚动点击穿透的bug
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>