0

我在 div 上使用 -webkit-animation，如下所示：

#agFloor {
    background-image: url('http://blabla/something.jpg');
    width: 375px;
    height: 364px;
    top:0;
    left:20px;
    -webkit-animation: FloorAnim 5s ease-in-out; 
}

与关键帧；

@-webkit-keyframes FloorAnim {
    0% { -webkit-transform: translateY(100%); }
    40% { -webkit-transform: translateY(-60%); }
    80% { -webkit-transform: translateY(-60%); }
    100% { -webkit-transform: translateY(0%); }
}

我的问题是，据我了解，这应该是一次性动画，但是当我使用 jQuery 淡出/隐藏和淡入/显示 div 时，就像每次都添加规则一样，因此每次显示 div 时都会完成动画或淡入。

这是 WAD 还是某种错误？，有没有办法避免这种行为？

我想只制作一次动画，然后使用 div 播放而不每次都触发动画。

谢了。

4

1 回答 1

1

当您进行隐藏时，设置-webkit-animation为none通过.css

$(this).css("-webkit-animation", "none");

http://jsfiddle.net/BHF8m/

于 2013-05-21T14:19:22.723 回答