"fade-in" Elemente der Liste nacheinander mit jQuery

Baue ich eine portfolio-Seite, die eine Liste von verschiedenen Projekten (in eine ungeordnete Liste). Beim laden der Seite " ich will jedes "li" für "fade-in", einer nach dem anderen. Ich dies erreicht haben, etwa so:

var eT = 0;     
$('.everything').hide().each(function() {
    $(this).delay(eT).fadeIn('slow');
    eT += 200;
});

Das problem, das ich habe ist, dass jedes li eine Klasse (oder mehrere) auf der Grundlage der Art der Arbeit (web, print, etc), die es repräsentiert. Es ist eine navigation zu der Seite, die Ihnen erlauben, um die filter der Art der arbeiten anzuzeigen. Was ich sehe, ist, dass wenn ich auf den Filter, während die animation ist immer noch be-in, das sich die Dinge wirklich chaotisch.

Hier ist die Vorlage der Arbeit Seite derzeit:
http://jjaakk.miller-interactive.com/templates/work.html

Ich habe versucht, viele Dinge, aber mit begrenztem Erfolg. Irgendwelche Gedanken auf, wie man diese Arbeit in einer stabileren Art und Weise?

Ich habe versucht, hinzufügen .stop() auf Klick, aber es hat nicht so geklappt wie ich wollte.

Beispiel-link ist kaputt

InformationsquelleAutor Jonathan Miller | 2011-04-13

Schreibe einen Kommentar