Jquery can't get div to animate

I’m trying to get a div to animate bounce, but it’s not working for me.

The div I’m referring to is the top yellow one with “Good teachers need to be discovered”. I created a div with the id=“main-teaser” but it won’t animate

I can get the text color to change if I change the addClass to a color and define the color, but I can’t get the animation to work.

Can anyone help? Thanks

You don’t have definitions for animated and bounce classes in your CSS. Did you intend, by any chance, to use Animate.css? Then you’ll need to include it as a dependency in Pen Settings -> CSS -> Add External CSS, it’s even available in Quick-add for ease of use.

1 Like

This is easiest method (for me atleast) to get animations done.
include this in your head tags <link rel="stylesheet" href="animate.min.css">
then pick animations you like here
and then just add that animations class to your div or whatever…
Here is github page, maybe it will be easier to follow instructions there. Good luck.

1 Like

thanks a lot! For some reason I thought the animation piece was baked into jQuery. Thanks for pointing me in the right direction. I just changed the Pen Settings and it worked right away

Thanks for the tip Freakout. Actually Velenir pointed me out to the simpler solution. In CodePen, you can add the animate.css library in the CSS options. For some reason, I thought that was part of jQuery.

Thanks again for the help!