[jQuery] Problem z selectorem :eq(index) Opcje

[paramoralny]

Witam,
jestem grafikiem-amatorem, który postanowił wziąć się za projektowanie stron www i w trakcie nauki napotykam różne problemy po czym staram się je zrozumieć

tego rozgryźć nie mogę chociaż wydaje się prosty

chcę żeby elementy paska nawigacyjnego pojawiały się po kolei, działa gdy każdemu nadam oddzielne id ale staram się to pominąć i skorzystać z szerokiej gamy dostępnych 'wybieraczy'
.nav:eq(0),.nav:eq(1),.nav:eq(2)... w teorii wybierają kolejne elementy o class="nav", w praktyce wyskakuje pierwszy i basta...

CODE

$(".centered").click(function()
{
$(this).slideToggle('fast');
$(".nav:eq(0)").css({"lineHeight":"100px","overflow":"visible"}).animate({height:'100px', width:'100px'},{duration: 500,easing:'easeOutElastic'},function()
{$(".nav:eq(1)").css({"lineHeight":"100px","overflow":"visible"}).animate({height:'100px', width:'100px'},{duration: 500,easing:'easeOutElastic'},function()
{$(".nav:eq(2)").css({"lineHeight":"100px","overflow":"visible"}).animate({height:'100px', width:'100px'},{duration: 500,easing:'easeOutElastic'},function()
{$(".nav:eq(3)").css({"lineHeight":"100px","overflow":"visible"}).animate({height:'100px', width:'100px'},{duration: 500,easing:'easeOutElastic'},function()
{$(".nav:eq(4)").css({"lineHeight":"100px","overflow":"visible"}).animate({height:'100px', width:'100px'},{duration: 500,easing:'easeOutElastic'});
});
});
});
});
});

próbowałem też przerobić ten kod na prostszy: pętle wywołującą kolejne nav-y ale okazało się to nie na moją głowę, może na to też macie pomysł?

[everth]

Może coś prostszego (IMG:style_emoticons/default/winksmiley.jpg)

[JAVASCRIPT] pobierz, plaintext 
jQuery.fn.showCascade = function(options) {
   var settings = jQuery.extend({
      duration: 500,
      height: '100px',
      width: '100px',
      easing:'easeOutElastic',
      css:{"lineHeight":"100px","overflow":"visible"}
   }, options);
 
   var inputObj = $(this);
   var iter= {i:-1, end:inputObj.length};
 
   function showThisItem(obj) {
      if (!obj) return;
      obj.css(settings.css).animate(settings,
	settings.duration,
	settings.easing,
	 function() {
	    showThisItem(getNext());
	 }
      );
   }
   function getNext() {
      iter.i++;
      return (iter.i<iter.end) ? inputObj.eq(iter.i):false;
   }
   showThisItem(getNext());
   return this;
}
//użycie
$('.nav').showCascade();
//z modyfikatorami
$('.nav').showCascade({
   duration:1000,
   easing:false,
   css:{"lineHeight":"200px","overflow":"none"}
});
[JAVASCRIPT] pobierz, plaintext 

Ten post edytował everth 6.09.2010, 22:57:25

[paramoralny]

Wersja, którą tu forsujesz nie istnieje, on zapewne podbiera ją pod pierwsze z pustym callbackiem. Więc wywołanie jej powinno raczej wyglądać tak:

to plugin jquery.easing.1.3.js

@everth
nie wiem co w tym prostego, staram się zrozumieć: reference w łapę i czytamy

ale nie działa (IMG:style_emoticons/default/sad.gif)
myśle, że to przez plugin z easingami (wymaga innej składni przy animate)