[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ł?

[masiakla]

[JAVASCRIPT] pobierz, plaintext 
$(".centered").click(function() {
$(this).slideToggle('fast');
$(".nav").first().css({"lineHeight":"100px","overflow":"visible"}).animate({height:'100px', width:'100px'},{duration: 500,easing:'easeOutElastic'},function() {
	$(this).next('nav').css({"lineHeight":"100px","overflow":"visible"}).animate({height:'100px', width:'100px'},{duration: 500,easing:'easeOutElastic'},function() {
		$(this).next('nav').css({"lineHeight":"100px","overflow":"visible"}).animate({height:'100px', width:'100px'},{duration: 500,easing:'easeOutElastic'},function() {
			$(this).next('nav').css({"lineHeight":"100px","overflow":"visible"}).animate({height:'100px', width:'100px'},{duration: 500,easing:'easeOutElastic'},function() {
				$(this).next('nav').css({"lineHeight":"100px","overflow":"visible"}).animate({height:'100px', width:'100px'},{duration: 500,easing:'easeOutElastic'});
			});
		});
	});
});
});
[JAVASCRIPT] pobierz, plaintext 

Ja osobiście wolałbym to załatwić setTimeout'em ...

Ten post edytował masiakla 6.09.2010, 15:32:30

[paramoralny]

hmm... to nie rozwiązuje problemu... wyskakuje tylko pierwszy div...

Ja osobiście wolałbym to załatwić setTimeout'em ...

...ale czy mógłbyś rozwinąć pomysł z setTimeout?

i czy istnieje sposób, żeby zrobić z tego jedno polecenie (pętle?) wywołującą kolejne elementy?