Jqueryスクロール位置の変更アンカーリンクの色がページセクションの1ページのWebサイトにある場合

Question

各if文に固有の番号があることがわかります。訪問した/現在の/アクティブなアンカーリンクのテキストの色を特に変更する必要があります。ページの高さは幅に依存しますので、これに対する解決策は何ですか？ あなたが混乱している場合は申し訳ありませんが、私は何について話しています。私はそれを解決し、英語完璧XD

Codepen

var bottomPage = $(window).scrollTop() + $(window).height() == $(document).height(); 
var scrollPos = $(window).scrollTop(); 

if(scrollPos >= 300 && scrollPos <= 854){ 
    $('header nav ul li a').removeClass(); 
    $('header nav ul li a[href="#about-nav"]').addClass('current'); 
}else if (scrollPos >= 855 && !bottomPage){ 
    $('header nav ul li a').removeClass(); 
    $('header nav ul li a[href="#portfolio-scroll"]').addClass('current'); 
}else if (bottomPage){ 
    $('header nav ul li a').removeClass(); 
    $('header nav ul li a[href="#contact-scroll"]').addClass('current'); 
}else { 
    $('header nav ul li a').removeClass(); 
} 

Answer 1

を通信することはできません！

ここに新しいコードがあります。私は、それが完璧に動作すると思います。

var bottomPage = $(window).scrollTop() + $(window).height() == $(document).height(); 
    var about = $('div#about-nav').position(); 
    var aboutPos = about.top; 
    var portfolio = $('div#portfolio-scroll').position(); 
    var portfolioPos = portfolio.top; 

    if(scrollPos >= aboutPos && scrollPos < (portfolioPos - 1)){ 
    $('header nav ul li a').removeClass(); 
    $('header nav ul li a[href="#about-nav"]').addClass('current'); 
    }else if (scrollPos >= (portfolioPos - 1) && !bottomPage){ 
    $('header nav ul li a').removeClass(); 
    $('header nav ul li a[href="#portfolio-scroll"]').addClass('current'); 
    }else if (bottomPage){ 
    $('header nav ul li a').removeClass(); 
    $('header nav ul li a[href="#contact-scroll"]').addClass('current'); 
    }else { 
    $('header nav ul li a').removeClass(); 
    }