CSS3 animation reset

Question

I have a question about CSS3. Is there an option to reset the animation after it finish (for example by using jQuery)?

Example: after button click, animation reset.

How are you creating the animation? with css3 `transition` or with jquery `.animate()`? — Zefiryn, Oct 02 '12 at 14:48
css3 animations: http://www.w3schools.com/css3/css3_animations.asp — Amay, Oct 02 '12 at 14:49

score 8 · Answer 1 · answered Oct 02 '12 at 16:57

8

I found better solution:

$('something').removeClass('anim').animate({'nothing':null}, 1, function () {
$(this).addClass('anim');
});

It's working. Ofc it need a css class '.anim' with the animation.

answered Oct 02 '12 at 16:57

Amay

1,461
5
27
56

score -1 · Answer 2 · answered Aug 13 '13 at 09:48

This question is old, but i figured out a nice way to restart a css3 animation with jQuery while i was working on a project, and now i want to share. here is the trick:

$('#anim-div').replaceWith($('#anim-div'));

and this will restart the animation on '#anim-div', it works.

CSS3 animation reset

2 Answers2