0

I am using a simple jQuery fadeIn on a nav element when the user scrolls down the page. I am also using the javascript animation based plugin skrollr. Here you can see my page, I've uploaded the files to a server:

http://www.unf.edu/~n00804716/my-site/

As you can see on a desktop size browser, when you scroll the animation begins based on your scrolling point in the viewport. The RGB circle spins and once the animation finishes spinning and fading out, the nav fades in. For some reason this is only working on large screens. The animation is working on mobile, but the nav is not fading in. Here is my script I'm using to fadeIn the nav once that animation is done:

$(window).on('scroll', onScroll);
   function onScroll() {
        if ($(document).scrollTop() > window.innerHeight) {
            $(".click").fadeIn(700);
            $("#logo").hide();
        } else {
            $(".click").fadeOut(700);
        }
    }
Austin Branham
  • 173
  • 3
  • 16

1 Answers1

0

On a mobile device you might have to invoke the event differently:

jQuery live scroll event on mobile (work around)

Community
  • 1
  • 1
Stefan Dochow
  • 1,454
  • 1
  • 10
  • 11