Question

css3 animation执行完1次后 怎么通过点击事件让他重新开始执行

动画初始化上来执行一次，想通过按钮点击让它在执行一次

Answer 1

把你执行动画的css写在JS的一个函数里面，函数里面给执行对象加css，每点击一下按钮就执行一下这个函数

追问

$(".btn").click(function(){
$(".btn").css("animation","anim 2s");
})
不起作用啊

追答

你先试下把你那句CSS写在CSS样式中可以用吗？
然后click事件中，用$(this)代替$(".btn")

追问

.b{
-webkit-animation: anim 2s;
}
$(".btn").click(function(){
$(".b").css("-webkit-animation","anim 2s");
})
css运行没问题，js运行还是不行，要不麻烦哥们给我写个

追答

能看一下你写的anim动画吗

追问

0%{left:0;top:0;}
25%{left:200px; top:0; }
50%{left:200px;top: 200px;}
75%{left:0;top: 200px;}
100%{left:0;top:0;}

追答

你的动画代码是OK的，如果你的页面简单的话可以发给我测试好给你发过来
你应该会用浏览器的f12吧，你点击按钮以后，看一下.b是否有-webkit-animation这个css，如果没有你随便赋值一个css样式，看下哪里问题

追问

点击完显示的内容：style="-webkit-animation: anim 2s; -webkit-animation-play-state: initial;"

追答

这个我也迷茫了，难道css里面写的动画，js不能调用，我先自己调试一个，sorry

追问

没事，你随便写个简单动画试试，如果行的通就发上来，多谢

追答

我写了一个，是可以的啊，你看一下，是不是你某个地方写错了。

这里有一个问题啊，每点击一次按钮加一个css，就会出现多个css，这个你处理一下