時間差でクラスを追加・削除したい(jQuery)
.delay()と.queue()の合わせで遅延実行を実現できる。
addClassして一定時間後にremoveClassしたい場合。
$('div').addClass('hoge').delay(1000).queue(function(next){
$(this).removeClass('hoge');
next();
});
時間差で要素リストにクラスを追加する方法。
const element = $('.element');
const delayTime = 300;
element.each(function (i) {
$(this).delay(i * delayTime).queue(function () {
$(this).addClass('is-active').dequeue();
});
});
.queue()してから.dequeue()をしてやらないとその後の処理が発火しなかったりするので要注意。
参考サイト
https://qiita.com/hms_yana/items/1a21c69f528eecc0214a
https://myscreate.com/queue/