jquery animate在ie8中不能完美运行

Question

除了 IE8 以外，所有浏览器都能正常运行。

在IE8中鼠标悬停时，所有盒子都在上升，鼠标离开时所有盒子都在下降，它只在IE8中发生。

IE7和IE9它工作正常。

JS

var timeoutId;

$('.box').mouseenter(function () {
    var $this = $(this);
    if (!timeoutId) {
        timeoutId = window.setTimeout(function () {
            timeoutId = null;
            $this.stop().animate({
                marginTop: '-224px',
                height: '300px'
            })
            $this.find('.rotate-arrow').addClass('rotate');
            $this.find('.header-content-span').css('display', 'none');
        },500); 
    }
});
$('.box').mouseleave(function () {
    var $this = $(this);
    if (timeoutId) {
        window.clearTimeout(timeoutId);
        timeoutId = null;  
    }
    $this.stop().animate({
        marginTop: '0px',
        height: '77px'
    })
    $this.find('.rotate-arrow').removeClass('rotate');
    $this.find('.header-content-span').css('display', 'block');
});

html（3盒）

<div class="box">
    <div class="box-heading bgc-cl1"></div>
    <div class="box-content"></div>
</div>

CSS

.box{
    float: left;
    width: 290px;
    height: 77px;
    margin: 0px 8px;
    overflow: hidden;
    cursor: pointer;
    -moz-box-shadow: 5px 5px 8px #888;
    -webkit-box-shadow: 5px 5px 8px #888;
    box-shadow: 5px 5px 8px #888;
    position: relative;
    z-index: 999;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    position: relative;
}