Почему это меню навигации с использованием jQuery не работает? - PullRequest
Новая
       45

Почему это меню навигации с использованием jQuery не работает?

0 голосов
/ 17 января 2020

Я следую учебному пособию для страницы блога, и когда я нажимаю на гамбургер, меню навигации не отображается с размером экрана меньше 750 пикселей. Вот мой html код: 

<nav class="nav">
    <div class="nav-menu flex-row">
        <div class="nav-brand">
            <a href="#" class="text-grey">Blooger</a>
        </div>
        <div class="toggle-collapse">
            <div class="toggle-icons">
                <i class="fa fa-bars"></i>
            </div>
        </div>
        <div>
            <ul class="nav-items">
                <li class="nav-link">
                    <a href="#">Home</a>
                </li>
                <li class="nav-link">
                    <a href="#">Catagory</a>
                </li>
                <li class="nav-link">
                    <a href="#">Archive</a>
                </li>
                <li class="nav-link">
                    <a href="#">Pages</a>
                </li>
                <li class="nav-link">
                    <a href="#">Contact Us</a>
                </li>
            </ul>
        </div>
        <div class="social text-grey">
            <a href="#"><i class="fab fa-facebook-f"></i></a>
            <a href="#"><i class="fab fa-instagram"></i></a>
            <a href="#"><i class="fab fa-twitter"></i></a>
            <a href="#"><i class="fab fa-youtube"></i></a>
        </div>
    </div>
</nav>

Вот мой jquery код, который я пытаюсь использовать для переключения моего меню навигации: 

    $(document).ready(function () {
    $nav = $('.nav');
    $toggleCollapse = $('.toggle-collapse');

    /** click event on toggle menu */
    $toggleCollapse.click(function () {
        $nav.toggleCollapse('collapse');
    })
});
...