Adicionar ordem de animação ao animate.css - jquery, css, html5, animação, animate.css

Gostaria de adicionar um atraso entre cada animação ao usar animate.css então eles vão animar em ordem. Por exemplo, northernlighting.no (itens de menu li).

O problema é que não tenho idéia de como animar cada elemento em vez de animar a lista inteira.

Respostas:

O jQuery pode fazer isso.

Verifique se você tem uma classe "oculta" atribuída ao que você está animando.

.hidden {
display: none;
}

Seu HTML seria assim

<ul>
<li id="content1" class="hidden">
<li id="content2" class="hidden">
<li id="content3" class="hidden">
</ul>

jQuery seria assim

$(document).ready(function () {
$("#content1").removeClass("hidden");
$("#content1").addClass("animated fadeIn");
$("#content2").delay("slow").removeClass("hidden");
$("#content2").addClass("animated fadeIn");
$("#content3").delay("slow").removeClass("hidden");
$("#content3").addClass("animated fadeIn");
});