Question

我在这个网站上发现这个脚本有助于在IE中淡入/淡出透明的.png而在淡入淡出效果期间没有用透明部分填充黑色：

var i;
  for (i in document.images) {
    if (document.images[i].src) {
        var imgSrc = document.images[i].src;
        if (imgSrc.substr(imgSrc.length-4) === '.png' || imgSrc.substr(imgSrc.length-4) === '.PNG') {
            document.images[i].style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled='true',sizingMethod='crop',src='" + imgSrc + "')";
        }
    }
}

此脚本由this stackoverflow user创建，在我的网站上运行良好。但是，我想稍微修改一下。此脚本在我的页面上查找所有.png文件并应用过滤器。但是，这可能会导致性能问题，因为我的网站上有许多透明的.png文件，但我只需将此过滤器应用于其中一个。它是一个固定位置菜单DIV背景图像，在页面滚动时使用jQuery淡入和淡出。

有人可以帮我修改这个脚本，以便我可以只提供一个图像或使用getElementById（“menu”）并让它应用此过滤器。我没有尝试任何东西似乎工作，并将过滤器放在我的CSS也不起作用，所以javascript方式似乎是要走的路。我只需要在一个.png上使用它，而不是全部。

记住这是div #menu的背景图片，所以图片本身没有ID，当然div也是。任何帮助将不胜感激。

Answer 1

根据规范，document.images会返回img个元素的集合，因此如果它是background-image，则无效。但是，如果它是在后台使用的img，它将起作用。如果您只是将它应用于一个您知道其ID的图像，那么它就是

function applyFilterToImageById(id) {
    var i,
        parentElement = document.getElementById(id);
    for (i in parentElement.images) {
    if (document.images[i].src) {
        var imgSrc = document.images[i].src;
        if (imgSrc.substr(imgSrc.length-4) === '.png' || imgSrc.substr(imgSrc.length-4) === '.PNG') {
            document.images[i].style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled='true',sizingMethod='crop',src='" + imgSrc + "')";
        }
    }
}

修改此脚本

1 个答案: