javascript - jqueryでバックグラウンド期間を設定する方法

Question

jQuery(document).ready(function(){
    jQuery('div').css('background','#fff').delay(12000).css('background','#000');
});

こんにちは仲間..なぜこれが機能しないのか疑問に思っています..背景の期間を設定し、特定の時間後に色を変更しようとしています。

Answer 1

あなたはsetTimeoutを試すことができます

jQuery(document).ready(function(){
    var divs = jQuery('div').css('background','#fff')
    setTimeout(function(){ divs.css('background','#000'); }, 12000);
});

Answer 2

純粋なCSSでこれを行うことができます

http://jsfiddle.net/austinpray/Q8TVX/

 body {
  animation:color-change 5s 1;
  -webkit-animation:color-change 5s 1; /* Safari and Chrome */
  animation-fill-mode: forwards;
  -webkit-animation-fill-mode: forwards;
}

@keyframes color-change
{
  0% {background:#fff;}
  90% {background:#fff;}
  100% {background:#000;}
}

@-webkit-keyframes color-change /* Safari and Chrome */
{
  0% {background:#fff;}
  90% {background:#fff;}
  100% {background:#000;}
}

アニメーションのプロパティを変更して、目的の効果を得ることができます。

http://caniuse.com/#feat=css-animation

Answer 3

jQuery の標準のエフェクト キューまたはカスタム キューでのみ機能するため、呼び出し.delay()を使用するだけでよいでしょう。setTimeout()

jQuery(document).ready(function(){
    jQuery('div').css('background','#fff')
    setTimeout( function(){ jQuery('div').css('background','#000'); }, 12000);
});

jsFiddle の例(より迅速に表示するために 3 秒のタイムアウトを使用)