CSS trigger javascript after transition/animation

Question

I'm not looking to trigger a CSS animation from JS, but rather the opposite.

If I do a CSS animation via the -webkit-transition or transition: all 1000ms type style sheet, is there a way to trigger a JS function after the transition is done?

Basically I've been doing animations via javascript and I want to convert some of them to CSS animations, but I need to trigger javascript events after the animations have completed.

Similiar http://stackoverflow.com/questions/2087510/callback-on-css-transition — Musa, Dec 04 '12 at 06:31
Awesome I didn't find that before posting. I need to fully test it but it seems to fit my needs. — Alberto, Dec 04 '12 at 07:17
Does this answer your question? [Callback on CSS transition](https://stackoverflow.com/questions/2087510/callback-on-css-transition) — djvg, Mar 30 '23 at 13:40

score 5 · Accepted Answer · edited May 23 '17 at 10:27

5

box.addEventListener('webkitTransitionEnd', function( event ) { 
     alert( "Finished transition!" ); 
}, false );

See: Callback on CSS transition

edited May 23 '17 at 10:27

Community

1
1

answered Dec 04 '12 at 06:34

Jack eten

66
1

Thanks. I missed the original post. – Alberto Dec 04 '12 at 07:19

CSS trigger javascript after transition/animation

1 Answers1