jquery Animate()无法在firefox中运行

时间:2012-07-22 14:23:33

标签: jquery css

我的动画在Chrome和Safari中运行良好,但在Firefox中却没有。我的jquery代码是

HTML

<ul id="clientlist">
    <li name="clientitem0" class="clientitem">
        <div id="client0" class="client shadow">
            <img src="images/work/bbc.jpg" border=0>
            <p>National BBC</p>
            <a href="bbc.co.uk">
                <div class="website"></div>
            </a>
        </div>
    </li>
</ul>

脚本

$("li[name^='clientitem']").each(function(index) {
    $(this).delay(200*index).fadeIn();
    $("#client"+index).delay(200*index).animate({"top": "0px"}, "slow");
});

的CSS

.client {
    position: relative; 
    top: 50px; 
    border: 1px solid #303234;
    background: #181B1D;
    -webkit-transition: -webkit-transform 0.2s linear;
}

1 个答案:

答案 0 :(得分:4)

您为transition引擎浏览器添加了webkit效果(例如SafariChrome等...)。您需要为其他引擎添加类似的东西:

.client {
    position: relative; 
    top: 50px; 
    border: 1px solid #303234;
    background: #181B1D;
    -webkit-transition: -webkit-transform 0.2s linear;
    -moz-transition: -moz-transform 0.2s linear; 
    -ms-transition: -ms-transform 0.2s linear;  
    -o-transition: -o-transform 0.2s linear;  
    transition: transform 0.2s linear; 
}