CODEWITHSUNDEEP
javascriptjquerycssanimate.csswow.js
Sam
Sam

Reputation: 47

Issues with wow.js

so trying to using wow.js in conjunction with animate.css

My animate css is working fine and wow.js has been included and activated but it isn't registering me scrolling down to the element so there for isn't animating.

What I've included at the bottom of html before the tag + the animate.css library imported into my main.css

<script src="https://cdnjs.cloudflare.com/ajax/libs/wow/1.1.2/wow.min.js"></script>
<script>
  new WOW().init();
</script>

viewport 

  <meta name="viewport" content="width=device-width, initial-scale=1">

main.js - should be irrelevant to wow.js

$(document).ready(function() {

    console.log('Document ready');

    $('.fa-bars').click(function() {
        $('.nav__links').toggleClass('menu-appear');
    });

    $('.nav .nav__links a').click(function() {
        $('.nav__links').toggleClass('menu-appear');
    });

});

animate has been imported into my main.css file.

Totally stumped why this isn't working. Any ideas, test site link is as follows.

http://loved-shrew.cloudvent.net

Upvotes: 1

Views: 3368

Answers (1)

Tank
Tank

Reputation: 1006

In your CSS, removing overflow: hidden; seems to get it working. I've only tested by unchecking this property in chrome devtools.

@media (min-width: 1200px)
7690b3e….css:7
html {
    /* overflow: hidden; */
    height: 100%;
}

Upvotes: 1

Related Questions