Javascript 滚动到锚点时更改链接属性

有人能帮我摆脱痛苦并“修复”或“解决”我的问题吗：正如你可以通过我的JSFIDLE链接看到的那样

我似乎无法让它工作-我想做的就是改变链接文本的颜色，以识别用户在页面的哪个部分。请帮帮我

---

提前感谢

更新：选择滚动菜单项

[更新]JSFIDLE:

添加了js

$(window).scroll(function () {
        // Get container scroll position
        var topHeight = $(this).scrollTop() + h + 10;
        var onTopId;
        $(".testx").each(function () {
            var curTop = $(this).offset().top;
            var curBottom = curTop + $(this).height();

            if (curTop < fromTop && curBottom > topHeight) {
                onTopId = $(this).attr("id");
            }
        });
        $selLink.removeClass("selected");
        $selLink = $("a[href=#"+onTopId+"]").addClass("selected");
    });

var $selLink = $("ul li a"); 
$(function(){
    $("ul li a").click(function(){
        $selLink.removeClass("selected");
        $selLink = $(this);
        $selLink.addClass("selected");
    });
});

.selected{
    color : #4B85C3;
}

css

$(window).scroll(function () {
        // Get container scroll position
        var topHeight = $(this).scrollTop() + h + 10;
        var onTopId;
        $(".testx").each(function () {
            var curTop = $(this).offset().top;
            var curBottom = curTop + $(this).height();

            if (curTop < fromTop && curBottom > topHeight) {
                onTopId = $(this).attr("id");
            }
        });
        $selLink.removeClass("selected");
        $selLink = $("a[href=#"+onTopId+"]").addClass("selected");
    });

var $selLink = $("ul li a"); 
$(function(){
    $("ul li a").click(function(){
        $selLink.removeClass("selected");
        $selLink = $(this);
        $selLink.addClass("selected");
    });
});

.selected{
    color : #4B85C3;
}

---

您正在检查链接的偏移量，而不是内容部分的偏移量。工作小提琴：

$（文档）。滚动（函数（）{
var h=$（“#主菜单”）.height（）*1.5；
var link1=$（“#home”）.offset（）.top；
var link2=$（“#about”）.offset（）.top；
var link3=$（“#工作”）.offset（）.top；
var selectedColor=“#4B85C3”；
var defaultColor=“#2e375b”；
var top=$（this.scrollTop（）-h；
$（“#主菜单li a”）.css（'color'，defaultColor）；
如果（top这样做的方法是重置所有链接的颜色，然后将$（this）的颜色设置为新颜色

jQuery(document).ready(function ($) {
    var h = $("#main-menu").height() * 1.25;
    $(".scroll").click(function (event) {
        $('a.scroll').css({"color": "#2e375b"});
        $(this).css({"color": "#4B85C3"});
        event.preventDefault();
        $('html,body').animate({
            scrollTop: $(this.hash).offset().top - h
        }, 300);
    });
});

您对link2和Link3的条件永远不会运行。Link1条件是唯一变为真的条件
$（this）.addClass（“已选”）
就足够了，分配它没有意义，因为您只使用了一次。这很好，比我原来使用的要简单得多，但是如果滚动到部分（即锚定）而不是单击，我可以添加相同的效果吗？这就是我想要的，谢谢Jonathan。我还需要它来做一件事h:当我回到家时，如何让“关于我”恢复到默认颜色？