javascript - jQuery scrollTop() problems -


i'm trying achieve this: qhen button clicked, html animated down "welcome" section , overflow-y visible (so can't scroll down header if not pressing button). (that's first script). i'm having problems second script. scrolls , fix document @ height 0px , can't scroll down. i'm trying achieve here if scroll welcome section, html animated top of page (returning @ initial state).

$(window).ready(function() {      $(".scroll-icon").click(function() {          $('html, body').animate({             scrolltop: $("#welcome").offset().top         }, 2000);           $("html").delay(200).queue(function (next) {              $(this).css({                 'overflow-y': 'visible'             });              next();            });     });       $(window).scroll(function() {          var distance = $("#welcome").offset().top            if ($(document).scrolltop() < distance) {              $('html, body').animate({                  scrolltop: $("#header").offset().top              }, 2000);           }      });   }); 

here's jsfiddle showing problem: https://jsfiddle.net/kp2yqyo8/6/

thanks :)

well tried this:

// 1. use flag check when you're welcome party!. window.imwelcome = false;  // 2. event click handler -- same $(".scroll-icon").click(function() {      $('html, body').animate({         scrolltop: $("#welcome").offset().top     }, 2000);   });    // 3. scroll handler... $(window).scroll(function() {      // 3.1 store values      var distance  = $("#welcome").offset().top     var scrolltop = $(document).scrolltop();      // 3.2 so..? did arrive party ?       if(scrolltop == distance){         window.imwelcome = true; // 3.2.1 oh yeah!        }        // 3.3 hmmm ... seems want leave huh? ok let me take home       if ($(document).scrolltop() < distance && window.imwelcome) {          $('html, body').animate({              scrolltop: $("#header").offset().top          }, 2000);           // oh you're home , not welcomed           window.imwelcome = false;       }   }); 

now, talking seriously, flag approach simple. used global variable because has keep state in flag.

jsfiddle here!


Comments