javascript - 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;
}