wow.js happens on page load and not on scroll

Question

I'm using wow.js, and it works fine, except the animations all happen immediately after the page load, and not when they are scrolled to. I followed the docs, but can't figure it out.

There are no JS errors on the page. I included both animate.min.css and wow.js

in the body:

<img src="images/philosophy.png" alt="Philosophy" id="philosophy-img" class="icon wow bounceInUp"> 

and in the footer:

<script>     new WOW().init(); </script> 

So how can use wow.js to get the animations to happen when scrolling to a particular div?

Answer 1

Here's the solution I found via a closed Github Issue: you can add this to your CSS:

.wow {    visibility: hidden; } 

WOW will then toggle it to visible when starting the animation.