[jQuery]addClassを指定時間遅らせる記述。

[jQuery]addClassを指定時間遅らせる記述。

2017年02月04日

.addClass()の実行を遅らせる時は.delay()は使えません。.queue()と.dequeue()を使いましょう。

[jQuery]addClassを指定時間遅らせる記述。

jQueryのanimateは.delay()を使えば実行を遅らせることができますが、addClassには.delay()は効きません。時間をおいてaddClassを実行させるのなら、.queue()と.dequeue()を使ってみましょう。

sample.js

$(function() {
  $('div').delay(1000).queue(function() {
    $(this).addClass('active').dequeue();
  });
});

これは、<div>に対して「active」というclassの付与の実行を1秒間遅らせる記述です。

参考:addClassを時間を置いて実行 – Qiita