twan
twan

Reputation: 2659

Scroll position not being detected good enough

I have a part of code that looks if a user is scrolling up or down, and inside that check if the user is at the top of the page.

To see my position I log that position in my console but for some reason when I scroll up using my scroll wheel fast, it shows a number like 75, 98, 66 etc. Only when I scroll again (while it's already at the top) it goes to 0. Why?

$(window).bind('mousewheel', function(event) {
  if (event.originalEvent.wheelDelta >= 0) {
    var height = $(window).scrollTop();
    console.log(height);
    if(height  > 20) {
        $('.nav-link').css('color', '#2f323a');
    }else{
        $('.nav-link').css('color', '#ffffff');
    }
  }
});

I want to change the text color of my menu to white when a user is at the top but now if I scroll up fast using my mouse scroll it does not work right away.

Upvotes: 0

Views: 47

Answers (1)

alotropico
alotropico

Reputation: 1994

Wouldn't you want to detect any kind of scroll? Not just mouse wheel.

$(document).ready(function() {
    $(window).scroll(function() {
        if ($(window).scrollTop() >= 20) {
            $('.nav-link').css('color', '#2f323a');
        } else {
            $('.nav-link').css('color', '#ffffff');
        }
    });
});

Upvotes: 1

Related Questions