バックグラウンドの色をフェードアウトするには

Question

私はdivに赤い背景があります。ユーザーがページを開くと、背景色がフェードアウトされます。 Divのコンテンツは引き続き表示されます。

私が使用：

$(".notificationExtraDetailsBlockColored").animate(5000, "slow", function() { 
     $(this).fadeIn("slow"); 
     $(this).css("background-color", "#FFF"); 
}); 

をしかし、それだけで効果フェードアウトのように振る舞っていない、背景色を変更するようです。

Answer 1

rgbaを使用して背景色をアニメーション表示します。残念ながら、jQueryを使って色をアニメーション化することは、あまりにも柔軟な何かを必要としないので、もし、あなたがいつも疑問に要素をアニメーション化するsetIntervalを使用することができ、loading one not-so-small plugin、オリジナルのjQueryの色のプラグインの拡張を意味します

// rgb(255, 255, 255) = white 
var color = [255, 255, 255].join(',') + ',', 
    transparency = 1, 
    element = this, 
    timeout = setInterval(function(){ 
     if(transparency >= 0){ 
      element.style.backgroundColor = 'rgba(' + color + (transparency -= 0.015) + ')'; 
      // (1/0.015)/25 = 2.66 seconds to complete animation 
     } else { 
      clearInterval(timeout); 
     } 
    }, 40); // 1000/40 = 25 fps 

もちろん場合上記のプラグインをいつでも使える複雑なものが必要です。 RgbaはIE9 +と他のすべての最新のブラウザでのみサポートされているので、IE8以下のユーザーに代わるものを提供することを検討したいかもしれません。

は、このコードは、ここで働いてください：http://jsfiddle.net/DCFem/2/