Estou tentando iniciar uma animação com o JQuery usando .css. Quero virar a letra para a esquerda, depois para a direita e novamente para a esquerda e para a direita enquanto estiver subindo.
$(".envelope").click(function() {
$(this).find(".list")
.animate({top:"0px"},1000);
$(this).find(".list").delay(100)
.css({"-ms-transform":"rotate(-6deg)","-webkit-transform":"rotate(-6deg)","transform":"rotate(-6deg)"});
$(this).find(".list").delay(200)
.css({"-ms-transform":"rotate(6deg)","-webkit-transform":"rotate(6deg)","transform":"rotate(6deg)"});
$(this).find(".list").delay(300)
.css({"-ms-transform":"rotate(-6deg)","-webkit-transform":"rotate(-6deg)","transform":"rotate(-6deg)"});
$(this).find(".list").delay(400)
.css({"-ms-transform":"rotate(6deg)","-webkit-transform":"rotate(6deg)","transform":"rotate(6deg)"});
});
Respostas:
1 para resposta № 1Você deve usar jQuery.queue para isso
http://api.jquery.com/jQuery.queue/
Eu posso fazer um exemplo se você precisar de um. Aqui está uma boa redação:
http://cdmckay.org/blog/2010/06/22/how-to-use-custom-jquery-animation-queues/
O exemplo está fazendo algo muito semelhante ao que você está tentando realizar. Deixe-me saber se você não consegue fazer isso funcionar. Posso dar um exemplo rápido para você.
0 para resposta № 2
O plugin de trânsito jQuery foi projetado exatamente para isso! É compatível com API de animação jQuery, mas usa transições CSS.
http://ricostacruz.com/jquery.transit/