jQuery animation only working in IE

Question

I have a very simple animation, were I have a tab at the side of the screen and if you click it, it will increase size. But it´s only working on IE, here is the code:

<script> 
$(function(){
  $("#a-tab > *").focusin(function(){
    $("#a-tab").animate({width:'320px'});
  });
  $("#a-tab > *").focusout(function(){
    $("#a-tab").animate({width:'10px'});
  });
});
</script>

It has to be #a-tab > * because of the inside content

Were is the problema, how can I make it compatible with Chrome, Firefox, etc.

Answer 1

U can try sumthin like this:

<script> 
$(function(){
  $("#a-tab > *").focusin(function(){
    $("#a-tab").stop().animate({width:'320px'});
  });
  $("#a-tab > *").focusout(function(){
    $("#a-tab").stop().animate({width:'10px'});
  });
});
</script>

Just add .stop() before .animate(). I hope that works for u :)