将活动的 Bootstrap 导航栏链接带到顶部答案

【问题标题】：Bring active Bootstrap navbar link to top将活动的 Bootstrap 导航栏链接带到顶部
【发布时间】：2015-07-22 16:25:34
【问题描述】：

我的网站上有一个 Bootstrap 导航栏，其中包含一个可以打开/关闭的折叠菜单。我希望这样当用户单击菜单中的一个链接（顺便说一句，这是一个下拉菜单）时，该活动链接应该跳转到菜单的顶部。这样他们就可以看到更多扩展的下拉项目列表。

这是一个常规的 Bootstrap 导航栏。我希望当我点击“下拉菜单”时，将该活动链接带到“项目名称”下的顶部。

【问题讨论】：

【解决方案1】：

如果我理解您想要正确执行的操作，从用户界面的角度来看，我强烈建议您不要这样做。对于可能对他们刚刚点击的东西移动的原因感到困惑的用户来说，这是非常出乎意料的行为。它还可能导致人们打开菜单时出错，然后（因为他们的手指可能仍靠近屏幕）意外单击其中一个菜单项并被移动到新页面。

如果您担心用户无法看到所有项目，也许您应该考虑为您的移动设备使用不同的菜单界面，例如 off-canvas menu（单击小“切换导航”按钮而不是 hamburner 菜单以请参阅关闭画布菜单）。这会给你更多的空间来玩你的菜单项。

【讨论】：

我有一个下拉菜单，它下面有很多选项（品牌名称列表），并且该下拉菜单恰好在我的菜单列表的下方，所以当用户单击它展开时，他们会只看到大概 4 个品牌。但如果品牌下拉菜单在点击时跳得更高，他会看到 10-15 个品牌。