Question

我正在尝试创建一个将出现在页面中间的弹出框。外部框由我们正在使用的CMS定义，它有一个溢出：隐藏和宽度：250px样式附加。我们想要“走出外箱”的内盒在我们的控制之下，我们可以做任何我们想要的事情。

不幸的是，我们在IE中尝试的一切都不会让弹出窗口从父盒子的溢出中“逃脱”：隐藏。在我们的例子中，不可能在父div之外移动弹出窗口。

注意 - 我们测试的所有其他浏览器都可以按照我们的意愿运行。

这是一个简单的例子。

<html>
<body>
    <div style="width:250px; overflow:hidden; background-color:#dddddd;">
        <p>
            Here is some text that appears within the primary outer box.
        </p>
        <div id='popup2' style="position:absolute; z-index:500; top:0px; left:0px; width:400px; height:200px; background-color:pink;">
            <a href="#" onclick="document.getElementById('popup2').style.display = 'none'; return false;">Close</a><br/>
            This is the popoup. This is the popoup. This is the popoup. This is the popoup. This is the popoup. This is the popoup. This is the popoup. This is the popoup. This is the popoup. This is the popoup.
            This is the popoup. This is the popoup. This is the popoup. This is the popoup. This is the popoup. This is the popoup. This is the popoup. This is the popoup. This is the popoup. This is the popoup.
            This is the popoup. This is the popoup. This is the popoup. This is the popoup. This is the popoup. This is the popoup. This is the popoup. This is the popoup. This is the popoup. This is the popoup.
        </div>
    </div>
</body>
</html>

Answer 1

我目前只能在IE9中测试它，但是如果你包含严格的doctype它可以正常工作：

http://jsfiddle.net/wgWZv/

jsfiddle使用html 5

<!DOCTYPE HTML>

我用4严格测试它也可以。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

走出溢出：IE中的隐藏框

1 个答案: