div被iframe挡住了,有何解决办法?

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了div被iframe挡住了,有何解决办法?相关的知识,希望对你有一定的参考价值。

页面A上要套入一个IFRAME页B,B页上有FLASH,DIV要显示在IFRAME的中间,可是要显示的DIV中的内容总是被IFRAME挡住!
试过给IFRAME套上DIV,再用z-index,可是不行,不知有没有什么好的解决方法!

iframe是一个可以加载另一个网页DOM,是一个Block级别的元素。
DIV仅是一个Block级别的元素。
可以进行如下操作
设置两个元素的z-index属性为0;
设置两个元素的float属性为left或者right都可以。
通过以上两种操作应该能解决问题
参考技术A 除了设定z-index外,你可以把想要在上层的模块的代码写在下层代码的上面,例如:
<body>
<div>上层</div>
<div>下层层</div>
</body>
参考技术B 把DIV的POSITION属性该成none.试试! 参考技术C position:relative;
z-index:10;

input textarea 获取焦点挡住输入法 解决办法

// .container 设置了 overflow 属性, 导致 Android 手机下输入框获取焦点时, 输入法挡住输入框的 bug
    // 相关 issue: https://github.com/weui/weui/issues/15
    // 解决方法:
    // 0. .container 去掉 overflow 属性, 但此 demo 下会引发别的问题
    // 1. 参考 http://stackoverflow.com/questions/23757345/android-does-not-correctly-scroll-on-input-focus-if-not-body-element
    //    Android 手机下, input 或 textarea 元素聚焦时, 主动滚一把
    if (/Android/gi.test(navigator.userAgent)) {
        window.addEventListener(‘resize‘, function () {
            if (document.activeElement.tagName == ‘INPUT‘ || document.activeElement.tagName == ‘TEXTAREA‘) {
                window.setTimeout(function () {
                    document.activeElement.scrollIntoViewIfNeeded();
                }, 0);
            }
        })
    }

  

以上是关于div被iframe挡住了,有何解决办法?的主要内容,如果未能解决你的问题,请参考以下文章

div层做的下拉菜单被同一页面的ifram挡住了怎么办?

object覆盖的div解决办法

div层做的下拉菜单被同一页面的ifram挡住了怎么办?

input textarea 获取焦点挡住输入法 解决办法

iframe中的div被另一个iframe挡住

DIV挡住iframe显示,怎么修改CSS