如何检测不呈现 .png 透明度的浏览器

Question

我有这段代码可以根据星期几呈现图像。但在 IE6 及更低版本以及可能其他一些浏览器中，它不会呈现 png 不透明度。所以我想稍微改变一下，这样它就可以检测到浏览器不呈现 alpha 透明度并告诉他们加载这个图像：“img/horarios2.png”。我已经尝试过这样做，以便排除以不渲染而闻名的 IE6 和更低版本，但后来我想到了我可能不知道的所有其他浏览器也不会渲染，并且需要一些可以统治它们的浏览器出也。我不知道实现这一点的最佳方法，所以我对所有建议持开放态度。

$(document).ready (function horario () {
var date = new Date();
var weekday = (date.getDay());

if (weekday==0)
    document.getElementById('horarios').src = "img/domingo.png";
else if (weekday==4)
    document.getElementById('horarios').src = "img/quinta.png";
else if (weekday==5)
    document.getElementById('horarios').src = "img/sexta.png";
else if (weekday==6)
    document.getElementById('horarios').src = "img/sabado.png";
else 
    document.getElementById('horarios').src = "img/quarta.png";
});

Answer 1

我对这个问题进行了相当多的研究，得出的结论是在 JavaScript 中创建功能测试是不可行的，并且 IE 6 是唯一不支持的严重使用的浏览器PNG透明度。在这种情况下，您最好的选择是有条件的 cmets，正如 Gabriel Ross 所推荐的那样。可以在纯 JavaScript 中使用条件 cmets，我认为这是您想要的：

var div = document.createElement("div");
div.innerHTML = "<!--[if lte IE 6]><i></i><![endif]-->";
var isIe6orLower = (div.getElementsByTagName("i").length == 1);

alert("Is IE 6 or lower: " + isIe6orLower);

2012 年 6 月 17 日更新

请注意 IE 10 will not support conditional comments，因此这种方法在 IE 的未来版本中将不起作用。

Answer 2

条件 cmets：

<!--[if IE 6]>
<script>
var ie6 = true;
</script>
<![endif]-->

Answer 3

我认为没有一种好的通用方法来检测是否支持 png 透明度。但是我现在所有的主流浏览器都支持它，除了 IE6，很少有 IE5.5。我认为您不必担心任何其他情况。

var badBrowser = (/MSIE ((5\.5)|6)/.test(navigator.userAgent) && navigator.platform == "Win32");

if( badBrowser ) {
    // change to "img/horarios2.png"
}

取自here。

Answer 4

IE6 可以通过non-standard css filter 渲染 png 透明度，它调用 directX 来代表 IE 处理透明度。

至于其他浏览器，只有 IE 愚蠢到只添加部分 PNG 支持。如果浏览器支持 png，您可以放心地假设它也可以处理透明度（IE 除外）。