Scroll page nav bar active remove active class

Question

I'm trying to perform a simple js/jquery task in which when I scroll the page the nav with an active class removes the active class. For some reason, my current code doesn't seem to work. Can someone give me some help?

$(window).scroll(function() {
    var windscroll = $(window).scrollTop();
    if (windscroll >= 100) {
        $('.wrapper section').each(function(i) {
            if ($(this).position().top <= windscroll - 20) {
                $('nav').removeClass('active');
                $('nav').eq(i).addClass('active');
            }
        });

    } else {

        $('nav.active').removeClass('active');
    }

}).scroll();

Answer 1

Hope This Solve your Problem

.header{
    height:1000px;
    border:1px solid #000;
}
.active{
    background:#ccc;
}

<div class="active header">
    navigation code
</div>

$(window).scroll(function(){
    var topvalue = 20;
    var scrollefromtop = $(window).scrollTop();
    if(scrollefromtop > topvalue){
        $(".header").removeClass("active");
    }else{
        $(".header").addClass("active");
    }
});