Mouseleave not really being called by IE with color animations

Question

I know that there are tons of questions like this on SO, but I haven't been able to find one with animating colors. On mouse over, it animates to a color (I made it an ugly blue just for testing purposes, and on mouse out, it animates to its original color. It works perfectly on all other browsers but IE, which animates the mouse over, but doesn't animate the mouse out.

The related js

$(".entry").mouseover(function () {

    $(this).animate({backgroundColor:"rgba(0,255,255,0.5)"},{duration:300, queue:false});

});

$(".entry").mouseout(function () {

    $(this).animate({backgroundColor:"white"},{duration:300, queue:false});

});

Answer 1

Try this

http://jsfiddle.net/W3PWA/1/

I only converted the backgroundColor to rgba instead of the word white. Since you are using the latest jquery, you should using .on()

$(".entry").on({
  mouseenter: function(){
    // your code
  },
  mouseleave: function(){
    // your code
  }
});