不透明度和过滤器导致 IE7 中的内存泄漏答案

【问题标题】：Opacity and filter causing memory leak in IE7不透明度和过滤器导致 IE7 中的内存泄漏
【发布时间】：2011-09-16 14:11:27
【问题描述】：

我有一个 div 定义为

<div id="block_screen">&nbsp</div>

有一个与其 id 关联的样式表

#block_screen
{
    position: absolute;
    background-color: #000;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    z-index: 9997;
    opacity: 0.25;
    filter: alpha(opacity=25);
}

目的是在显示这个 div 时将背景显示为半透明灰色。这就是我使用不透明度和过滤器样式的原因。它工作正常。但是在 IE7 中，每次显示 div 时都会导致内存泄漏。我的猜测是因为 IE7 无法优雅地处理不透明度和过滤器样式。 IE8 和其他浏览器运行良好。

如果我想使用 IE7，是否有解决此问题的方法？

【问题讨论】：

您还期待什么？不应使用过滤器。旧的 IE 无法显示“很酷的新东西”，接受它。当你添加像Alpha(Opacity) 这样的黑客时，因为你的客户要求支持 IE6 - 你实际上正在破坏 IE6 用户的体验...... IE7 不那么极端，但一样。
@c69，你从哪里找到“不应该使用过滤器”的规则？旧 IE（第 4 版，于 1997 年发布）发明了“很酷的新东西”的概念，现在它已成为 CSS3 规范的一部分。 Alpha(Opacity) 不是 hack，它是在 CSS2 发布之前创建的可靠功能 - 远在 CSS3 之前。除非它们被过度实施（像任何东西一样），否则它们不会破坏 IE6/7 用户的体验。在这种情况下，内存泄漏很可能与不正确的 dom 操作或泄漏的 javascript 事件有关。但绝对与filter 或opacity 属性无关。
@MarcusPope 当不太聪明的客户要求我为 ie6 制作具有 alpha 不透明度的画廊时（在过去），可怜的东西甚至无法移动（因为你有 20 个过滤器）和经常坠毁。 UI 响应能力很差，当您尝试滚动或调整大小时 - 整个事情被锁定了大约 10 秒钟，然后重新绘制了自己。这是更好的体验吗？我不这么认为。此外，DX 过滤器非常好，以至于微软完全从 IE10 中删除了对它们的支持。
@c69 - 嗯，我不认为经验证明完全避免使用过滤器是合理的。听起来您的系统资源有限，并且可能还有一些回流问题 - 这两种方法都有解决方法。但这就是为什么我指出适度使用不会破坏体验或导致内存泄漏。是的，过滤器在 IE9 中已被弃用，因为它现在支持 CSS3。这种转变与 DX 挂钩的质量无关，与更新到现代标准有关。在 1997 年，它们非常出色，今天它们仍然是许多 CSS3 属性的最佳 polyfill。

标签： css memory-leaks filter opacity alpha-transparency

【解决方案1】：

在我的 IE 特定样式表中，我倾向于使用小于 9 的 IE：

 -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=85)";
filter: alpha(opacity=85);
background-color: #000;

在我的脑海中，我相信 -ms-filter 是 ie6'ism 和 ie7/8 的过滤器。我没有遇到任何内存泄漏，所以说实话，我很想去别处看看。

【讨论】：

你说得对，但-ms-filter 是一个 ie8-ism，它允许符合标准、以供应商为前缀的过滤器属性根据 css2.1 规范进行验证。您仍然可以在 IE8 和 9 中使用 filter:，尽管该功能现在已弃用并且在 IE10 中可能不存在
另外，旧的 filter 属性现在与 css4 filters 的名称冲突。