0

このサイトでこのスクリプトを見つけました。これは、フェード効果中に透明部分が黒で塗りつぶされることなく、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 + "')";
        }
    }
}

このスクリプトはこのstackoverflowユーザーによって作成されたもので、私のサイトでは完全に機能します。ただし、少し変更したいと思います。このスクリプトは、私のページ上のすべての.pngファイルを検索し、フィルターを適用します。ただし、サイトに透明な.pngファイルが多数あるため、パフォーマンスの問題が発生する可能性がありますが、このフィルターを適用する必要があるのはそのうちの1つだけです。これは、ページのスクロール中にjQueryを使用してフェードインおよびフェードアウトする固定位置メニューのDIV背景画像です。

誰かがこのスクリプトを変更して、1つの画像を提供するか、getElementById（ "menu"）を使用して、このフィルターを適用できるようにするのを手伝ってもらえますか。私が試したことは何も機能していないようで、CSSにフィルターを配置することも機能しなかったので、javascriptの方法がうまくいくようです。すべてではなく、1つの.pngで使用する必要があります。

これはdiv#menuの背景画像であるため、画像自体にはIDがありませんが、もちろんdivにはあります。どんな助けでも大歓迎です。

4

1 に答える 1

0

仕様によると、document.imagesimgは要素のコレクションを返すため、それが の場合background-imageは機能しません。ただし、それimgがバックグラウンドで使用されている場合は機能します。ID がわかっている 1 つの画像にのみ適用する場合は、次のようになります。

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 + "')";
        }
    }
}
于 2012-10-04T20:51:45.247 に答える