页眉模板 汉堡包样式无法使用

[DCSCDF]

Describe the bug
当窗口缩小到出现折叠条的时候无法点击折叠条伸缩（最靠后的下拉框也无法使用）

To Reproduce

Logo

Animated

• First Item
• Second Item
• Third Item

    <div class="nav-right">
        <div class="nav-item active">
            <a href="#">Active</a>
        </div>
        <div class="nav-item">
            <a href="#">Link 1</a>
        </div>
        <div class="nav-item has-sub" id="dropdown">
            <a class="nav-dropdown-link">Click Me</a>
            <ul class="dropdown-menu" role="menu">
                <li role="menu-item"><a href="#">First Item</a></li>
                <li role="menu-item"><a href="#">Second Item</a></li>
                <li role="menu-item"><a href="#">Third Item</a></li>
                <li class="dropdown-menu-divider"></li>
                <li role="menu-item"><a href="#">Fourth Item</a></li>
            </ul>
        </div>
    </div>
</div>

[Spiderpig86]

不好意思，我最经很忙所以我没回答你的问题。如果你要使用汉堡包 menu，你必须加自己的 JavaScript 函数。下面的函数是一个例子：

// Get all the nav-btns in the page
let navBtns = document.querySelectorAll('.nav-btn');

// Add an event handler for all nav-btns to enable the dropdown functionality
navBtns.forEach(function (ele) {
    ele.addEventListener('click', function() {
        // Get the dropdown-menu associated with this nav button (insert the id of your menu)
        let dropDownMenu = document.getElementById('MENU_ID_HERE');

        // Toggle the nav-btn and the dropdown menu
        ele.classList.toggle('active');
        dropDownMenu.classList.toggle('active');
    });
});

你可以在这里读更多关于汉堡包菜单的使用。