ページスクロール量に応じて自動的に位置を調整する固定ナビゲーションバーの実装は、現在のスクロールバーの値とページ内の対応するコンテンツの値の大小関係を判断することによって、表示するコンテンツを選択するというのがその核となる考え方です。JavaScriptコードは以下の通りです（jQueryライブラリを使用しています）：

    $(document).ready(function () {
        $(window).scroll(function () {
            var top = $(window).scrollTop();
            var menu = $("#menu");
            var items = $("#content").find(".item");
            //スクロールバーがスクロールした際に、対応する値を取得する。
            var currentId = "";
            //スクロールバーがスクロールした際に、ナビゲーションメニューが自動的にフォーカスを設定するようにする。
            items.each(function () {
                var This = $(this);
                var itemTop = This.offset().top;
                if (top > itemTop - 200) {
                    currentId = This.attr("id");
                } else {
                    return false;
                }
            })
            //対応する階層のaタグにcurrentクラスを設定し、他のリンクのcurrentクラスを解除する。
            var currentLink = menu.find(".current");
            if (currentId && currentId != "#"+currentLink.attr("href")) {
                currentLink.removeClass("current");
                menu.find("[href=#" + currentId + "]").addClass("current");
            }
        })
    })