1

IE8でfadeToと組み合わせて透過性を機能させることに問題があります。背景画像 (PNG) で透明度が維持された状態でフェードインおよびフェードアウトする代わりに、そうでなければ透明度が存在する場所に厄介な黒い境界線が表示されます。

私は高低を検索しましたが、SOには良い答えと思われるものがたくさんありますが、自分に合った答えを見つけることができず、その理由について途方に暮れています.

これが私のコードです:

    jQuery(document).ready(function($) {

        InOut($('#bubblewrap li:first'));

        function InOut(elem) {
            elem.delay().fadeTo(1500, 1).delay(700).fadeTo(1500, 0, function() {
                if (elem.next().length > 0) {
                    InOut($(this).next());
                }
                else {
                    InOut($(this).siblings(':first'));
                }

            });
        }

        $('#bubblewrap li').mouseover(function() {
            $(this).siblings().add(this).stop(true, false).css("opacity", 0);
            $(this).show().css("opacity", 1);
        });
        $('#bubblewrap li').mouseout(function() {
            if ($(this).is(":visible") == true) {
                InOut($(this));
            }
        });
    });

SOで見つかった一般的なソリューションのいくつかを私のコードに組み込む方法について、誰か提案はありますか? どんな助けでも大歓迎です。

4

1 に答える 1

1

IE8 (古い IE) は、半透明 (つまり png) 要素の不透明度を処理できません。これはまさにあなたがそこに見ているものです。通常、背景色を設定すると (したがって、要素には半透明のピクセルがありません)、画像とともに役立ちます。

あなたの場合、a)フェードではなく、IE <9でのみ表示することを検討できますb)jpg画像の一部を背景として使用し、その上にpngを配置します(追加の要素が必要です)c)css3ボーダー半径とボックスシャドウで効果を再作成しますcss3pie に処理させます。ただし、アニメーションではうまくいかない可能性があります-これは試していません.

于 2012-04-11T10:08:36.560 に答える