2012-02-29 20 views
1

Web上でコードを探していますが、問題は無限ではないので、最後の要素から最初からやり直す必要があります1。ここで無限jqueryプラグインが動作しない

元のスクリプト

jQuery.fn.fadeInSequence = function(fadeInTime, timeBetween) 
{ 
    //Default Values 
    timeBetween = typeof(timeBetween) == 'undefined' ? 0 : timeBetween; 
    fadeInTime = typeof(fadeInTime) == 'undefined' ? 500 : fadeInTime; 

    //The amount of remaining time until the animation is complete. 
    //Initially set to the value of the entire animation duration. 
    var remainingTime = jQuery(this).size() * (fadeInTime+timeBetween); 

    var i=0; //Counter 
    return jQuery(this).each(function() 
    { 
     //Wait until previous element has finished fading and timeBetween has elapsed 
     jQuery(this).delay(i++*(fadeInTime+timeBetween)); 

     //Decrement remainingTime 
     remainingTime -= (fadeInTime+timeBetween); 

     if(jQuery(this).css('display') == 'none') 
     { 
      jQuery(this).fadeIn(fadeInTime); 
     } 
     else //If hidden by other means such as opacity: 0 
     { 
      jQuery(this).animate({'opacity' : 1}, fadeInTime); 
     } 

     //Delay until the animation is over to fill up the queue. 
     jQuery(this).delay(remainingTime+timeBetween); 

    }); 

}; 

})(jQuery); 

は、私が試したものですが、動作しません:

jQuery.fn.fadeInSequence = function(fadeInTime, timeBetween) 
{ 
    //Default Values 
    timeBetween = typeof(timeBetween) == 'undefined' ? 0 : timeBetween; 
    fadeInTime = typeof(fadeInTime) == 'undefined' ? 500 : fadeInTime; 

    //The amount of remaining time until the animation is complete. 
    //Initially set to the value of the entire animation duration. 
    var remainingTime = jQuery(this).size() * (fadeInTime+timeBetween); 

    var i=0; //Counter 
    return jQuery(this).each(function() 
    { 
      if(jQuery(this).is(':last-child')){ 
      //Wait until previous element has finished fading and timeBetween has elapsed 
      jQuery(this).parent().find('.slide').eq(0).delay(i++*(fadeInTime+timeBetween)); 

      //Decrement remainingTime 
      remainingTime -= (fadeInTime+timeBetween); 

      if(jQuery(this).parent().find('.slide').eq(0).css('display') == 'none') 
      { 
       jQuery(this).parent().find('.slide').eq(0).fadeIn(fadeInTime); 
      } 
      else //If hidden by other means such as opacity: 0 
      { 
       jQuery(this).parent().find('.slide').eq(0).animate({'opacity' : 1}, fadeInTime); 
      } 

      //Delay until the animation is over to fill up the queue. 
      jQuery(this).parent().find('.slide').eq(0).delay(remainingTime+timeBetween); 
       }else{ 
      //Wait until previous element has finished fading and timeBetween has elapsed 
      jQuery(this).delay(i++*(fadeInTime+timeBetween)); 

      //Decrement remainingTime 
      remainingTime -= (fadeInTime+timeBetween); 

      if(jQuery(this).css('display') == 'none') 
      { 
       jQuery(this).fadeIn(fadeInTime); 
      } 
      else //If hidden by other means such as opacity: 0 
      { 
       jQuery(this).animate({'opacity' : 1}, fadeInTime); 
      } 

      //Delay until the animation is over to fill up the queue. 
      jQuery(this).delay(remainingTime+timeBetween); 
       } 
    }); 

// LE

(function(jQuery) { 
jQuery.fn.fadeInSequence = function(fadeInTime, timeBetween) 
{ 
    //Default Values 
    timeBetween = typeof(timeBetween) == 'undefined' ? 0 : timeBetween; 
    fadeInTime = typeof(fadeInTime) == 'undefined' ? 500 : fadeInTime; 

    //The amount of remaining time until the animation is complete. 
    //Initially set to the value of the entire animation duration. 
    var remainingTime = jQuery(this).size() * (fadeInTime+timeBetween); 

    var i=0; //Counter 

    var counter = 0; 
     var listSize = $(this).size(); 
while(true) 
{ 
    $elem = $(this).get(counter); 


     //Wait until previous element has finished fading and timeBetween has elapsed 
     jQuery(this).delay(i++*(fadeInTime+timeBetween)); 

     //Decrement remainingTime 
     remainingTime -= (fadeInTime+timeBetween); 

     if(jQuery(this).css('display') == 'none') 
     { 
      jQuery(this).fadeIn(fadeInTime); 
     } 
     else //If hidden by other means such as opacity: 0 
     { 
      jQuery(this).animate({'opacity' : 1}, fadeInTime); 
     } 

     //Delay until the animation is over to fill up the queue. 
     jQuery(this).delay(remainingTime+timeBetween); 

    counter++; 
    if(counter >= listSize) 
    { 
     counter = 0; 
    } 
} 
}; 
})(jQuery); 
.eachの代わりに10

答えて

0

を使用し、whileループと$(this).get(x)呼び出しを使用します。ループの最後に、x ++をスローし、リストのサイズを超えた場合はxを0に戻します。

var counter = 0; 
var listSize = $(this).size(); 
while(true) 
{ 
    $elem = $(this).get(counter); 
    //stuff goes here 
    counter++; 
    if(counter >= listSize) 
    { 
     counter = 0; 
    } 
} 

編集:残念ながら、いくつかの(すべて?)ブラウザは無限ループで悩んでいます。別の方法として、jquery timerプラグインを含めてみてください。これは本質的に、このような繰り返しのアニメーションを扱うように設計されており、全く同じ方法で叫び、死ぬべきではありません。次に、ループスルーするアニメーションとして「once through」アニメーション機能を適用します。

+0

私はそれを更新しました、それは動作しません、私は強制的にページを殺す必要があります私の記事を見てください... – Uffo

+0

"動作しません"とはどういう意味ですか?あなたはどんなふるまいをしていますか? –

+0

なし、ページがロードされています....私はページを殺すためにクロムが私に尋ねるので、whileループがページを殺すと思います。 – Uffo

関連する問題