JQuery背景色のクロム

Question

JQueryのホバーイベントで背景色が変わるサンプルで問題が発生しました。 （.css("background-color","rgba(78, 175, 212, 0.75)");の行）

その他すべての変更は、不透明度でも機能しますが、「rgb(0, 0, 0)」では常に変化する背景色ではありません。 このエラーはChromeでのみ表示され、IEまたはMozillaでは表示されません（すべての最新版）。

私は、処理の前にclass .overにプロパティbackground-colorまたはopacityがないことを指定します。

ここ

サンプルである：

jQuery(document).on({ 
    mouseenter: function(){ 
     jQuery(".over, .overVideo",this).clearQueue() 
       .css("display", "block") 
       .css("height", "200px") 
       .animate({height:'350px'},{duration:200}) 
       .css("opacity", "0.5") 
       .css("background-color","rgba(78, 175, 212, 0.75)"); 

     jQuery(".blur, .blurVideo",this).clearQueue() 
       .css("height", "200px") 
       .animate({height: '350px'},{duration:200}); 
    }, 

...

I背景色ラインを移動しようとし、私は#FFF」のように、 "青" のように、色の別の種類を設定しようとしました"、または" rgb（12,12,12） "と似ていますが、常に同じ問題です。

あなたは私を助けることができますか？

Answer 1

私はjsfiddleに行き、あなたが求めるものを作った。

HTML：

<div class="hoverme" style="width:100px;height:100px;background-color:black;"> 

のjQuery：

$(document).ready(function() { 
    $('.hoverme').hover(function(){ 
    $(this).css("background-color","rgba(78,175,212,0.75)"); 
    }) 
}); 

それは基本的な背景色のものをして、あなただけの残りの部分を追加する必要があり、それはあなたの問題を解決する必要があります！アニメイト方法について

Answer 2

使用コールバック：短い手のための

.css({display: 'block',height: '200px'}); 

：

jQuery(".over, .overVideo",this).clearQueue() 
    .css("display", "block") 
    .css("height", "200px") 
    .animate({height:'350px'},{duration:200},function(){ 
     $(this).css("opacity", "0.5") 
     $(this).css("background-color","rgba(78, 175, 212, 0.75)"); 
}) 

私はまた、次の代わりに、1つの宣言のように使用するCSS方式にあなたをお勧めします。