0

多くの人が知っているように、アルファ透明度を使用してPNGをアニメーション化することは<IE8あまりうまく機能しません。したがって、で不透明度のアニメーション化を無効にし<IE8ます。

私がこのようなことをしているのを見ることができる唯一の方法は、これをすることです：

HTML

<!--[if lt IE 8]>
    <script type="text/javascript">
        var browserUnsupported = true;
    </script>
<![endif]-->

JAVASCRIPT

// Test if the browser is supported
if(browserUnsupported){
    // Hide the element
    $('#test').hide();
}else{
    // Fade out the element and then hide it
    $('#test').animate({
        opacity:0   
    },200,function(){
        $(this).hide();
    })
}

// Once the animation has completed, continue
setTimeout(function(){
    // This will execute once the animation has completed
    // We cannot use the callback in case the browser is unsupported
    // and the animate function has not been used
},200);

しかし、これはかなり長い修正です。特に、何かをアニメーション化するたびに、これを実行する必要があることを考慮した場合はなおさらです。

誰かがより良い代替案を思い付くことができますか？

Internet Explorer 8以下で不透明度のアニメーション化を無効にできますか？ハッキングがある場合は、jQueryをローカルに保存せず、GoogleCDNからロードすることを考慮してください。これが唯一のオプションであっても、jQueryソースを変更するつもりはありません。

アップデート

私はブラウザのバージョンを検出するためのより良い方法を探していません。上記のコードは、説明のみを目的としています。私が知りたいのは、jQueryによってアニメーション化する不透明度を制御できる方法があるかどうかです。または、条件があればアニメーション化するより良い方法はありますか？そうでない場合はアニメーション化しないでください。

アップデート

このようなもの（テストされていません）：

function myAnimate(styles,duration,easing,callback){
    // Get the selected element
    var element = this.elements;
    if($.browser.msie && $.browser.version<8){
        delete options.opacity;
    }
    // Call the animation method
    element.animate(options,duration,easing,callback);
}
4

2 に答える 2

1

たとえば、jQueryを使用$.browserして$.browser.version()

if($.browser.msie && $.browser.version < 8) {
 //fallback
} else {
 //real code
}

編集

条件に基づいて関数を実行するようにjQueryを拡張する独自の実行関数を作成できます。Internet Explorerでないことを条件にした場合は、IEを使用している場合は、この種の関数が呼び出されないようにすることができます。実行関数は次のようになります（ただし、テストされていません）

$.fn.execute = function(a) {
    return this[a].apply(this, [].slice.call(arguments, 1));
}

condition = $.browser.msie;
$('div').execute(condition ? 'true' : 'false', function() {...});
于 2012-11-23T12:48:07.823 に答える
0

$().fadeOut正確にあなたが望むことをします-不透明度をアニメートしてから隠します：

if(ie){
  $("#test").hide()
}else{
  $("#test").fadeOut(200)
}

簡潔なコードが好きなら、あなたはすることができます

$("#test").fadeOut(supported && 200)

または、すべてのアニメーションをグローバルに無効にすることもできます

if(ie) $.fx.off = true;

または、jQueryに追加することもできる関数でロジックをラップします。

$.fn.fadeIfSupported = function(){
  if(unsupported){
    this.hide()
  }else{
    this.fadeOut.apply(this, arguments)
  }
}
...
$("#test").fadeIfSupported(200);
于 2012-11-23T12:58:21.747 に答える