Css animate on :active (kinda)

[grimski]

Hi there,

I have a css animate which works fine, it can run when the style sheet is loaded and on hover etc.

Now, I was wondering how to go about creating the effect the animate runs on :active, ie when the object is pressed. This does work on :active but who holds their mouse down? So you only see a fraction of the animation.

Anyone got any ideas on how to achieve this? Only thing I can think of now if that when you click a class is applied – and the animate runs then. I guess another click would remove the class, then reapply it so the animation runs again?

Look forward to hearing some good solutions! :)

[Kitty Giraudel]

You got it right. You will have to use JavaScript to apply a class to trigger the animation when clicked, unless you want to use a [CSS click event](http://tympanus.net/codrops/2012/12/17/css-click-events/).

[Author]

Posts