0

以前は 3 つの異なるページがあり、現在のページへのナビゲーション バーのリンクが 'id="selected' になった 1 ページの Web サイトを取得しました。

#selected {
background-color:white;
color: #645406;
cursor: default;
}

あなたがそのページにいるとき。リンクはアンカー リンクと同じように機能するため、少し難しくなります。ユーザーがスクロールしている場所を検出し、ユーザーがアンカーをスクロールしたときにアンカーのリンクを自動的に「id="selected"」に切り替えるスクリプトが必要です。

例: http://jsfiddle.net/mbSXB/

4

1 に答える 1

1

これを試してくださいhttp://jsfiddle.net/8NKqf/1/

$(function() {
    var anchors = $('.anchor');
    var navLinks = $('.navigointi a');

    $(window).scroll(function() {
        var scrollTop    = $(window).scrollTop();
        var clientHeight = document.documentElement.clientHeight;
        var activeSectionAnchor, hash;

        anchors.each(function() {
            if ($(this).offset().top < scrollTop + clientHeight) {
                activeSectionAnchor = $(this);
            }
        });

        hash = "#" + activeSectionAnchor.attr('name');

        activeLink = navLinks.removeClass('selected').filter('[href="' + hash + '"]');

        activeLink.addClass('selected');
    });
});
于 2013-11-07T15:57:43.993 に答える