IE高度> 4096px显示透明度错误？

当我在大页面上遇到问题时，我正在处理带有透明背景叠加层的JavaScript对话框。IE高度> 4096px显示透明度错误？

如果页面很大，透明覆盖图将是纯色（即不再透明）。我做了一些测试，发现这只发生在叠加高于4096像素（嗯，可疑，这是2^12）。

任何人都可以验证此问题吗？你有没有看到解决方法？

这里是我的测试代码（我使用的原型）：

<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>

来源

2009-04-21 Diodeus - James MacFarlane

任何工作解决方案对于IE？ – muneebShabbir 2012-05-22 05:53:34

您需要确定屏幕何时大于4096，并使用多个叠加层，其中一个位于前一个之下。 – 2012-05-22 13:21:18

既然你在CSS上有一个不透明度过滤器，我相信你是间接使用DirectShow下的alpha混合和图像合成的封面。 DirectShow使用DirectX纹理，DX9具有4096x4096像素限制，这将解释这种不规律的行为。

来源

2009-04-22 18:10:25 codekaizen

如何使覆盖的窗口，而不是页面大小的尺寸，并且移动它向上或向下滚动。

来源

2009-04-21 23:38:02 wheresrhys

这是一种可能性，但我担心滞后，特别是在pgup/pgdown上。我确实找到了一个更简单的解决方案 - 使用多个叠加DIV，每个DIV都占用小于4906px的屏幕的一小部分。 – 2009-04-22 15:05:33

你已经在边缘操作了（这是巨大的......），所以我不知道MS会将它归类为一个错误或“修复”它，即使它是。

您可能需要将其分解为较小的叠加DIV。

来源

2009-04-22 17:53:09

是的，我结束了使用多个DIVs和根据页面大小调整/定位它们。 – 2009-04-22 20:13:57

为什么你不会将覆盖层固定？
这样，它不必像整个页面内容一样大。

简单地做：

#Overlay{ 
    position:fixed; 
    left:0px; 
    top:0px; 
    height:100%; 
    width:100%; 
    rest of declarations 
}

只要确保它的父是文件和文档的宽度和100％的高度。这样你就可以做得更好，覆盖面更小。

注意：固定将确保覆盖层相对于视口的位置。因此它总是显示在左上角。

来源

2009-04-22 18:08:58

位置：固定解决方案是一个多发点解决方案..它在IE中不被很好的支持。

最好的办法是自动创建并附加额外的透明元素（最大高度为2048px，以覆盖XP DX8也有此问题）。

这是我使用的代码，假设您已经有一个浮动的div解决方案。

if(document.getElementById('document_body').scrollHeight > 2048) 
    { 
     document.getElementById('float_bg').style.height = "2048px"; 
     document.getElementById('float_bg').style.zIndex = -1; 
     count=1; 
     total_height=2048; 
     while(total_height < document.getElementById('document_body').scrollHeight) 
     { 
      clone = document.getElementById('float_bg').cloneNode(true); 
      clone.id = 'float_bg_'+count; 
      clone.style.zIndex = -1; 
      //clone.style.backgroundColor='red'; 
      clone.style.top = (count*2048)+"px"; 
      document.getElementById('float_el').insertBefore(clone,document.getElementById('float_bg')); 
      count++;     

      this_add = 2048; 
      if((total_height + 2048) > document.body.scrollHeight) 
      { 
       clone.style.height = (document.body.scrollHeight - total_height); 
      } 
      total_height += this_add; 
     } 
    } 
    else 
    { 
      document.getElementById('float_bg').style.height = document.body.scrollHeight + "px"; 
    }

来源

2009-09-08 20:23:15

IE高度> 4096px显示透明度错误？

回答

相关问题