jquery - jQuery トグルに遅延を追加する方法

Question

.moreをクリックすると、次のクラスを非表示から表示に切り替えています。

$( ".more, .less" ).click(function() {
var $this = $(this);
  $this.siblings(".controls").toggle();
  $this.siblings(".phone").toggle();
  $this.siblings(".less").toggle();
  $this.toggle();
});

質問: 現時点では、これはすべて瞬時に発生します。これらを 2 秒間隔で (表示されている順序で) 発生させるにはどうすればよいですか?

Answer 1

.toggle()の前に.delay ()を追加し、パラメーターを .toggle() に渡して、トグルの速度を設定します。デフォルトの400であっても、toggleに必要な速度を指定しないと、すぐに表示されるようです。

$('.box').delay(1000).toggle(400);

フィドル