javascript - 导航栏 anchor 无法使用 js 正确定向

Question

这可能只是我挑剔，但我有一个难以描述的小问题。在我的炼功点here ，导航栏(我终于很好地工作了)有一个问题，一旦窗口的大小调整到低于必要的宽度以变成下拉菜单，网站就不再滚动到每个部分的顶部。相反，它似乎滚动到该部分的顶部减去/加上菜单下拉菜单的高度。由于我选择了在选择链接后折叠菜单，我认为理想的解决方案是在菜单完全折叠后滚动页面。也许这会有所帮助。关于如何实现这一目标的任何建议？您应该能够在“scripts.js”文件的源代码中看到我所做的。

编辑:经过进一步检查，我发现此问题仅在导航栏已固定在顶部(因此位于“工作”部分下方的任何位置)时重新加载页面后才会出现。 我希望我可以通过屏幕截图更好地展示，但对我来说最好的复制方式似乎是在页面的不同位置重新加载后尝试链接。
例如-如果您在底部重新加载页面，然后尝试使用下拉菜单，您会在提供的图片中看到这种情况:

图 1:

图 2:

Answer 1

在调整大小时使用 .off() 语句删除事件并使用 .on() 再次添加它们。问题是，当您附加事件时，它使用页面上的固定点，但当您调整浏览器大小时，这些点不再位于页面上的正确位置。通过这样做，您将更新浏览器滚动到的位置。

例如:

$(window).on('resize', function(){
    // remove whaetver events you have attached
    $('#navbar').off('event names go here');

    // Re-attach the events
    $('#navbar').on('event names go here');
});