所以我在这里有这个漂亮的CSS动画,我希望它循环.
我几乎没有CSS动画的经验,但遗憾的是没有想法如何做到这一点.如果有人在这里帮助我,我真的很感激.谢谢!
HTML
<div id="msg">Weeeeeee</div>
Run Code Online (Sandbox Code Playgroud)
使用Javascript
$("#msg").click(function() {
var duration = 1400;
$msg = $(this);
$msg.css("-webkit-transform", "scale(2)")
.css("-webkit-transition-timing-function", "ease-out")
.css("-webkit-transition-duration", duration + "ms");
setTimeout(function () {
$msg.css("-webkit-transform", "scale(1)")
.css("-webkit-transition-timing-function", "ease-in")
.css("-webkit-transition-duration", duration + "ms");
}, duration);
});
Run Code Online (Sandbox Code Playgroud)
CSS
#msg { font-size: 40pt; font-weight:bold; text-align:center; line-height: 120pt; }
Run Code Online (Sandbox Code Playgroud) 最新的Chrome版本(49)中存在一个错误,其中CSS就像......
background: linear-gradient(currentColor, green);
Run Code Online (Sandbox Code Playgroud)
... color元素更改时不会更新(例如:on:hover).
我该如何解决这个问题?