gpt4 book ai didi

css - 如何解决这个 IE6 z-index 错误?

转载 作者:行者123 更新时间:2023-11-28 15:02:28 24 4
gpt4 key购买 nike

我读过这个iFrame workaround对于 IE6。但是如果我动态显示 DIV,我真的不明白如何使用它。

我附上了一个样本。单击输入元素时,我想显示一个具有最高 z-index 的 div 面板。(应该显示在选择控件上)

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Test</title>

<script type="text/javascript">
function showItem(obj) {
obj.style.visibility = 'visible';
obj.focus();
}
</script>

</head>
<body>
<input onclick="showItem(myPanel)" />
<div id="myPanel" style="position: absolute; top: 35px; left: 10px; width: 200px;
height: 200px; background-color: Gray; visibility: hidden; color: Silver;">
Hello world
</div>
<div>
<select name="thisDD" id="thisDD">
<option value="1">One</option>
<option value="2">Two</option>
<option value="3">Three</option>
</select>
</div>
</body>
</html>

最佳答案

要使用 iframe 解决方法,您需要在相同的坐标、相同的宽度、相同的高度和低 z-index 声明一个 iframe。

<iframe id="iframe" style="position: absolute; top: 35px; left: 10px; width: 200px; height: 200px; visibility: hidden; z-index: 1" frameborder="0"></iframe>

然后你需要在 div 上声明一个更高的 z-index:

<div id="myPanel" style="...; z-index: 2"></div>

然后当您显示 Item 时,同时显示 iframe 和 div。 iframe 将位于 div 后面,因为它的 z-index 较低。

关于css - 如何解决这个 IE6 z-index 错误?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/1543577/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com