Scroll Animation: Animate.css Wow.js

use Animate.css with jQuery

View a video tutorial on how to use Animate.css with jQuery here.

//cdnjs.cloudflare.com/ajax/libs/animate.css/3.7.0/animate.min.css

//cdnjs.cloudflare.com/ajax/libs/wow/1.1.2/wow.min.js
//cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js

REF: animate.css
REF: wow.js docs

#test1:

click HERE to add animation to another element with jQuery


however, this animation can only be played once.
#test2:

click HERE to add animation to another element with jQuery



$('#test2 a.button').on('click', function(e){ e.preventDefault(); // prevent the link jump to top of the page var animationName = "animated shake"; var animationend = "webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend"; $('#test2 input[name=firstName]').addClass(animationName).one(animationend, function(){ $(this).removeClass(animationName); }); }); }); // using 'one' instead of 'on', is that: 'one' will only listen for the event once and then unbind itself