MediaElement.js Internet Explorer 8 显示块状矩形答案

【问题标题】：MediaElement.js Internet Explorer 8 showing blocky rectanglesMediaElement.js Internet Explorer 8 显示块状矩形
【发布时间】：2012-06-25 20:06:58
【问题描述】：

我正在使用 MediaElement.js Wordpress 插件来在我的主页上播放 MP3。

但在 Internet Explorer 8 上，我遇到了插件问题。

而不是播放按钮和音量按钮，它只显示一个块状矩形。我已经在两台不同的计算机上进行了测试，结果相同。

你可以在这里测试它：http://www.alatarmusic.com/noise-reduction/

它适用于 Firefox 和我 iPhone 上的 Safari。而且我知道，其他网站在我的 Internet Explorer 中显示良好。例如，MediaElementJS.com 上的播放器看起来是正确的。我的主页好像有问题？

但是这可能是什么原因呢？

【问题讨论】：

标签： internet-explorer-8 mediaelement.js

【解决方案1】：

在 IE7 和 IE8 中遇到同样的问题：

我的解决方法是确保过滤器样式已重置：

filter: none;

【讨论】：

【解决方案2】：

您的 style-sheet 包含以下 CSS：

.post .content button{background:linear-gradient(top,#ffffff 0%,#e9e9e9 100%);-ms-filter:"progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff',endColorstr='#e9e9e9')";

美化：

.post .content button {
    background: linear-gradient(top,#ffffff 0%,#e9e9e9 100%);
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff',endColorstr='#e9e9e9')";
}

最后一个属性-ms-filter 是 Microsoft 专有的 CSS 扩展，只能由 Internet Explorer 解析。

#ffffff 为白色，#e9e9e9 为浅灰色。

由于该效果仅在 Internet Explorer 中有效，因此只有 IE 用户会看到一个浅色矩形而不是播放按钮。

将filter 设置为none 会返回按钮：

此标记可能会影响您的 Wordpress 博客中的其他按钮，因此删除它可能不是一种选择。相反，您可以将filter:none 添加到.mejs-button 的CSS；例如：

.mejs-button{
    filter: none;
}

【讨论】：