CSS3动画在Chrome / Safari上有不同的结果

Question

我正在使用skew()转换处理CSS3关键帧动画。我能够在Safari 6中找到我想要的结果。但是，当我在另一个Webkit浏览器上查看该页面时，我得到的是不同的动画结果。

这是我的代码：

HTML

<div id="test">
    webkit animation test
</div>

CSS

#test {
    position: absolute;
    left: 200px;
    top: 0px;
    width: 200px;
    height: 200px;
    background-color: rgba(0,0,0,0.5);
    -webkit-animation-name: testBox;
    -webkit-animation-duration: 5s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-delay: 0s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-direction: alternate;             /* alternate, normal */
    -webkit-animation-play-state: running;
}

@-webkit-keyframes testBox /* Safari and Chrome */ {
    0% {
        -webkit-transform: skew(70deg,0deg);
    }

    100% {
        -webkit-transform: skew(-70deg,0deg);
    }
}

其他人有这个问题吗？