javascript - ターゲットの #div が選択またはスクロールされたときにアンカーの色を変更する方法

Question

アンカー ターゲットが表示されているときに、特定のアンカーの色を変更したいと考えています。アンカーの色を変更するという点で、ほとんど機能するjqueryスクリプトがありますが、ターゲットから10px程度下にスクロールするまでは機能しません。また、対象の div の高さとページの上部からの距離も異なります。パディングとマージンを使用してみましたが、#div h1 などの div 内のさまざまな要素をターゲットにすることである程度の成功を収めましたが、#div だけをターゲットにしたいと思います。

$(document).scroll(function(){
    if($(this).scrollTop()>=$('#main-page').position().top){
        $("#main").css("color","#ff2a2a");
        $("#news,#about").css("color","#fff");
    }
});

...そして、ページ上に多くのセクションがある場合は、それを繰り返します。