Question

假设这个css仅适用于chrome（我已经测试过chrome beta 41. *并且实际上是在40.0.2214.111 m）

考虑一个简单的盒子和一个css＆＃34;：hover＆＃34;在其上发射脉冲（比例）动画。

这里是代码

.box{
   background-color:black;
   width:100px;
   height:100px;
   position:absolute;
   top:25px;
   left:25px;
}
.box:hover{
   -webkit-animation-name: pulse;
   -webkit-animation-duration: 5s;
   -webkit-animation-iteration-count: infinite;
   -webkit-animation-timing-function:ease;
}
@-webkit-keyframes pulse{
    0% { 
        -webkit-transform: scale(1);
    }
    50% { 
        -webkit-transform: scale(1.5);
    }
    100% { 
        -webkit-transform: scale(1);
    }
}

（jsfiddle here：livedemo）

正如你所看到的，这可以在Chrome上没有iusse ...但我的观点是重复这个动画只有一次而不是无限。

所以我们将-webkit-animation-iteration-count: infinite;更改为-webkit-animation-iteration-count: 1;（在jsfiddle现场演示中试用它），iusse出来了！

基本上，如果我没有将-webkit-animation-iteration-count设置为无限，那么即使除了显式数字设置之外，动画也会过快地激活！

感谢任何建议！

...只是为了让你知道...
我在没有结果的铬瑕疵上搜索了它 2.我在这里没有结果，除了这个帖子没有回答Webkit animation-iteration-count bug in Chrome
3.此代码可以使用到上个月（我不记得它开始失败的确切日期） 4.如果我重新启动我的电脑，这个iusse将不会出现1或2次..但经过几次页面刷新后，我无法播放动画和交互计数！=无限！

编辑：测试Chrome Canary版本42.0.2298.0 canary（64位），它完美运行...所以我想这个错误将在一些Chrome标准版更新后消失。

PS：抱歉我的英语很差！

webkit-animation-iteration-count仅适用于INFINITE

0 个答案: