Retroceder animação

[Caio Cafardo 7]

Oi pessoal, to fazendo um projeto que tem muita animação no hover do mouse, eu preferiria fazem em html 5.0, mas esse projeto infelizmente rodará apenas no IE (é um projeto interno e na empresa só pode ter IE).

Quando se coloca o mouse faz uma animação X, quando se tira ela volta, até aí fiz assim:

$(".home_caixa1").hover(function(){
  $(".home_caixa1_frente").animate({"marginTop":"-280px"}, 400);
  $(".home_caixa1_fundo_caixa").delay(400).animate({"width":"244px"}, 300);
  $(".home_caixa1_fundo_topo").delay(750).animate({"marginTop":"0px"}, 300);
  $(".home_caixa1_fundo_primeiro").delay(1000).fadeIn(300);
  $(".home_caixa1_fundo_linha1").delay(1000).fadeIn(300);
  $(".home_caixa1_fundo_segundo").delay(1250).fadeIn(300);
  $(".home_caixa1_fundo_linha2").delay(1250).fadeIn(300);
  $(".home_caixa1_fundo_terceiro").delay(1500).fadeIn(300);
},function(){
  $(".home_caixa1_fundo_terceiro").fadeOut(300);
  $(".home_caixa1_fundo_segundo").delay(250).fadeOut(300);
  $(".home_caixa1_fundo_linha2").delay(250).fadeOut(300);
  $(".home_caixa1_fundo_primeiro").delay(500).fadeOut(300);
  $(".home_caixa1_fundo_linha1").delay(500).fadeOut(300);
  $(".home_caixa1_fundo_topo").delay(750).animate({"marginTop":"-48px"}, 300);
  $(".home_caixa1_fundo_caixa").delay(1100).animate({"width":"0px"}, 300);
  $(".home_caixa1_frente").delay(1400).animate({"marginTop":"0px"}, 400);
});

O Problema é se o usuário coloca e tira o mouse rapidamente antes mesmo da animação terminar, começa a dar chabu, o que fazer? Tem algum jeito da animação parar onde esta e retoceder daquele ponto?

[William Bruno 1501]

Que tal vc usar css transition no lugar de fazer tudo com jQuery ?

[Caio Cafardo 7]

Mas não roda no IE, e o cliente (empresa com 2 mil funcionários) só tem IE, e é um trampo pra intranet....

Preferiria!

[Sensir 0]

Parece problema das queues. Seria mais fácil se fornecesse um jfiddle ou codepen para saber exactamente o problema