当我在大页面上遇到问题时,我正在处理一个带有透明背景覆盖的 JavaScript 对话框。
如果页面很大,透明覆盖将是纯色(即不再透明)。我做了一些测试,发现这只发生在覆盖层大于 4096 像素高时(嗯,可疑,那是 2^12)。
有人可以验证这个问题吗?您见过解决方法吗?
这是我的测试代码(我使用的是 Prototype):
<style>
.overlayA {
position:absolute;
z-index:10;
width:100%;
height:4095px;
top:0px;
left:0px;
zoom: 1;
background-color:#000;
filter:alpha(opacity=10);
-moz-opacity:0.1;
opacity:0.1;
}
.overlayB {
position:absolute;
z-index:10;
width:100%;
height:4097px;
top:0px;
left:0px;
zoom: 1;
background-color:#000;
filter:alpha(opacity=10);
-moz-opacity:0.1;
opacity:0.1;
}
</style>
<div style="width:550px;height:5000px;border:1px solid #808080">
<a href="javascript:// show overlay A" onclick="Element.show('overlayA')">Display A = 4096h</a>
<br /><a href="javascript:// show overlay B" onclick="Element.show('overlayB')">Display B = 4097h</a>
</div>
<div id="overlayA" onclick="Element.hide(this)" class="overlayA" style="display:none"></div>
<div id="overlayB" onclick="Element.hide(this)" class="overlayB" style="display:none"></div>
最佳答案
由于您在 CSS 上有一个不透明度过滤器,我相信您在幕后间接使用 DirectShow 进行 alpha 混合和图像合成。 DirectShow 使用 DirectX 纹理,DX9 有 4096x4096 像素限制,这可以解释这种不稳定的行为。
关于html - IE 在高度 > 4096px 时显示透明度错误?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/775041/