4

スクリプトが実行される.nextボタンをダブル/トレブル/etcクリックした瞬間、次々にキューに入れる必要がありますか？再開する前に機能を完了するために、これを行うにはどうすればよいですか？

HTML

<ul id="one" class="first selected">
   <li class="pic_one"></li>
   <li class="pic_two"></li>
   <li class="pic_three"></li>                       
</ul>
<ul id="two">
   <li class="pic_one"></li>
   <li class="pic_two"></li>
   <li class="pic_three"></li>                        
</ul>
<ul id="three" class="last">
   <li class="pic_one"></li>
   <li class="pic_two"></li>
   <li class="pic_three"></li>                        
</ul>

jQuery

$('.slider .next').click(function(){
   if($('.slider ul.selected').hasClass('last')){
      // leave blank
   } else {
      $('.slider ul.selected').hide('slide', { direction: "left" }, 1000);  
      $('.slider ul.selected').removeClass('selected');
      $('.slider ul').parent().next('ul').show('slide', { direction: "right" }, 1000).addClass('selected'); 
   }
});
4

2 に答える 2

3

Roryの答えに似ていますが、：animated疑似セレクターを使用します。これにより、要素のアニメーション中にクリックイベントが処理されるのを防ぎます。

$('.slider .next').click(function(){
   if($('.slider ul.selected').is(':animated')) return;

   if($('.slider ul.selected').hasClass('last')){
      // leave blank
   } else {
      $('.slider ul.selected').hide('slide', { direction: "left" }, 1000);  
      $('.slider ul.selected').removeClass('selected');
      $('.slider ul').parent().next('ul').show('slide', { direction: "right" }, 1000).addClass('selected'); 
   }
});
于 2012-11-02T16:48:11.857 に答える
0

私があなたの質問を正しく理解しているなら...あなたはアニメーションが複数のクリックでスタックするのを防ごうとしているだけです。.stop()次のアニメーションを呼び出す前に使用してください。

例：

$('.slider .next').click(function(){
   if($('.slider ul.selected').hasClass('last')){
      // leave blank
   } else {
      $('.slider ul.selected').stop().hide('slide', { direction: "left" }, 1000);  
      $('.slider ul.selected').removeClass('selected');
      $('.slider ul').parent().next('ul').stop().show('slide', { direction: "right" }, 1000).addClass('selected'); 
   }
});
于 2012-11-02T16:52:33.737 に答える