语义UI - 以下菜单示例

Question

我是Semantic UI的新手，我想在右侧的Semantic UI's documentation中看到以下菜单。我想将这个函数实现到固定的顶层菜单 - 所以当达到header元素的id时，应该更改菜单中的active元素。我正在查看docs.js的代码，其中这是为文档的站点实现的，但如果您是第一次使用Semantic UI，则此代码非常复杂。我的菜单有这些课程：ui大顶固定隐藏菜单

是否已经内置了以下菜单（可能不是因为文档中没有提到它？）或者我用jQuery添加它？

Answer 1

semantic-ui只为你提供造型。单击菜单项后，您可以更新项目的活动状态。

这就是我们在代码中实现它的方式 -

const menuNav = $('.ui.menu.menu-component .item');
menuNav.on('click', function (item) {
  menuNav.removeClass('active');
  $(this).addClass('active');
});

要记住的另一件事是，您需要检查页面加载时的URL，以便您可以将相应的项目标签设置为活动。