語義用戶界面 - 以下菜單示例

Question

我是新近使用語義用戶界面的用戶，我想實現以下菜單，如右側Semantic UI's documentation所示。我想實現這個功能到固定的頂級菜單 - 所以當頭元素的id到達時，菜單中的活動元素應該被改變。我在查看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，這樣就可以在相應項目的標籤設置爲激活。