Question

我正在构建其中一个“向下滚动”的网站，其中包含不同的部分，但基本上你只需要/可以做的就是滚动或按下菜单，这些菜单会自动滚动到选定的部分。

我有一块js用.active类更新菜单链接，这样当你向下滚动时，你看到的部分的相应菜单项将变为活动状态。虽然它在Chrome上运行得很好，但我似乎无法在Firefox / Explorer上运行..我只是找不到问题......

我制作了一个小jsfiddle（http://jsfiddle.net/Lxzwfk0u/）描述我正在构建的网站，正确地更新了活动类。（至少它在chrome atm上显示正确）

有人可以帮我找到问题所在吗？我把它缩小到小提琴中的一点点js。我想......（也可以在这里发帖，也许你可以立即发现错误）

// add and remove 'active' class by scroll position
$(document).on("scroll", onScroll);
    function onScroll(event){
        var scrollPos = $('body').scrollTop();
        $('nav a').each(function () {
            var currLink = $(this);
            var refElement = $(currLink.attr("href"));
            if (refElement.position().top - 40 <= scrollPos && refElement.position().top - 40 + refElement.height() > scrollPos) {
                $('nav a').removeClass("active");
                currLink.addClass("active");
            }
            else{
                currLink.removeClass("active");
            }
        });
    }

由于

Answer 1

http://jsfiddle.net/Lxzwfk0u/2/

我所做的唯一改变是：

var scrollPos = $(document).scrollTop();

当我之前回显此变量时，它会在IE和FireFox中给出值0。我想这是因为body元素上没有滚动条，而是它位于document元素上。

Firefox中的javaScript错误 - 无法使用活动类更新菜单项

1 个答案: