模糊的 IE8 不透明度问题

Posted 2023-03-06

【中文标题】模糊的 IE8 不透明度问题

【英文标题】：Obscure IE8 Opacity Issue

【发布时间】：2013-06-23 20:56:50

【问题描述】：

我在处理 IE8 和 Websphere 6.1 时遇到了一个奇怪的不透明度问题。

有一个非常基本的不透明度设置，我们在某个屏幕上方有一个模态类型对话框。我在后台的屏幕顶部放置了一个不透明的 div，因此用户无法单击任何控件但可以看到它，然后在顶部添加对话框并强制他们回答问题。看起来很基本，而且很容易做到。

这是用于创建上述不透明效果的 css：

.wipeOutDiv 
top: 0px;
left: 0px;
position: absolute;
width: 100%;
height: 100%;
background-color: #d9d9d9;
filter: alpha(opacity=70);
opacity: 0.70; 

这是用于创建对话框的 CSS：

.dialogBox 
position: absolute;
width: 350px;
margin: auto; 
z-index: 1;
background-color: white;
border-top:12px solid;
border-top-color: #ffd93f; 
border-left: 2px solid;
border-right: 2px solid;
border-bottom: 2px solid;
border-color: #ffd93f; 
padding: 8px;
top: 40%;
left: 40%;
font-family: arial;
font-size: 8pt; 

这个方案在所有浏览器的开发中都能正常工作。在我的机器上本地运行良好，在集成环境上也运行良好。以为我是清白的。

但是，一旦进入我们的 ST 环境或更高版本，不透明度无法在 IE8 中正常工作。它仍然适用于 Chrome 和 FF，但由于某种原因 IE8 无法正常工作。使用 'wipeOutDiv' CSS 类的 div 变得完全可靠，看起来很奇怪。我尝试过修改 IE 的浏览器模式和文档模式，但我所做的任何更改都无法使其在这些环境中工作。

我比较了环境之间的 DOM 文档，它们是相同的。留给我的唯一变量是应用程序服务器本身，在本例中是 Websphere 6.1。我注意到一个区别是它工作的环境是通过 http 提供的，而它不是 https 的环境。这似乎更像是一个巧合，而不是真正的根本原因。

我很生气。大家有什么建议或者类似的经历吗？

【问题讨论】：

您是否也比较了两种情况下的有效 CSS 参数？由于某种原因，我只能认为 CSS 资源文件没有通过 HTTPS 正确加载。在 WAS 上启用 HTTP 访问日志并检查错误是有意义的 - pic.dhe.ibm.com/infocenter/wasinfo/v6r1/topic/…

是的，我研究了页面中的 CSS 参数；它们是相同的，但都有一个奇怪的神器。它将两个值堆叠到同一行。查看图片：Image 我将不得不查看 WAS 上的 HTTP 日志，看看是否有任何显示。

用于创作 CSS 文件的操作系统是否与运行 WAS 的操作系统相同？如果它们不同，是否会导致行尾字符转换不正确？

开发操作系统是 Win 7 和目标操作系统 MS Server 2008。我还注意到 CSS 值在 IE 和 Chrome 中是随机/无序的，其中的顺序与上面列出的完全匹配。似乎 IE 正在重新排序 css 参数；不确定这是否重要。我查看了 WAS 6.1 实例上的 HTTP 访问日志，其中没有错误。此时要检查的东西已经不多了。

【参考方案1】：

这最终成为 IE 在本地计算机上在不受信任的站点上启用“保护模式”的问题。 IE opacity hack 需要使用外部 .DLL 文件，如果没有启用保护模式，IE 不会让这种情况发生。只有当某人的机器在生产中正常工作并且他们注意到他们已将该站点添加到受信任列表中时，才能解决此问题。