Задать вопрос
@freelancer007
html

Компонент nav (bootstrap 3), почему не раскрывается выпадающий список?

Всем доброго дня!
Есть меню на сайте (nav Bottstrap3), добавил в него подпункты, при просмотре с на мониторе, все работает корректно, но при просмотре мобильной версии не раскрывается выпадающий список, при клике на него, меню просто сворачивается в исходное состояние, не могу разобраться в чем причина, пожалуйста, помогите советом. Спасибо.
<nav class="navbar bg-color3">
    <div class="container">
        <a class="navbar-brand goto" href="#" ><img src="img/logo.png" height="25" alt="" data-selector="img"></a>
        <button class="round-toggle navbar-toggle menu-collapse-btn collapsed" data-toggle="collapse" > <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button>
        <div class="collapse navbar-collapse navMenuCollapse">
            <ul class="nav">
                <li><a href="#" >Пункт 1</a></li>
                <li><a href="#" >Пункт2</a></li>
                <li><a href="#" >Пункт3</a></li>
                <li><a href="#" >Пункт4</a></li>
                <li class="dropdown">
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown">Выпадающий пункт <span class="caret"></span></a>
                    <ul class="dropdown-menu" role="menu">
                        <li><a href="#">Подпункт</a></li>
                        <li><a href="#">Еще подпункт</a></li>
                        <li><a href="#">Еще что-то</a></li>
                        <li class="divider"></li>
                        <li><a href="#">И еще</a></li>
                    </ul>
                </li>
            </ul>
        </div>
    </div>
</nav>
  • Вопрос задан
  • 108 просмотров
2 комментария
Подписаться 1 Средний 2 комментария
Решения вопроса 1
sonca-ca
@sonca-ca
Ваш код у меня в принципе не работает так, как должна работать навигация по теме бутстрапа.
Прежде чем кастомизировать, убедитесь что у вас просто пример работает, а потом уже меняйте/добавляйте/etc

<nav class="navbar navbar-default bg-color3">
  <div class="container">
    <div class="navbar-header">
      <button type="button" class="round-toggle menu-collapse-btn  navbar-toggle collapsed" data-toggle="collapse" data-target="#id_to_collapse" aria-expanded="false">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <a class="navbar-brand goto" href="#"><img src="img/logo.png" height="25" alt="" data-selector="img"></a>
    </div>
    <div class="collapse navbar-collapse navMenuCollapse" id="id_to_collapse">
      <ul class="nav navbar-nav">
        <li><a href="#" >Пункт 1</a></li>
        <li><a href="#" >Пункт2</a></li>
        <li><a href="#" >Пункт3</a></li>
        <li><a href="#" >Пункт4</a></li>
        <li class="dropdown">
          <a href="#" class="dropdown-toggle" data-toggle="dropdown">Выпадающий пункт <span class="caret"></span></a>
          <ul class="dropdown-menu" role="menu">
            <li><a href="#">Подпункт</a></li>
            <li><a href="#">Еще подпункт</a></li>
            <li><a href="#">Еще что-то</a></li>
            <li class="divider"></li>
            <li><a href="#">И еще</a></li>
          </ul>
        </li>
      </ul>
    </div>
  </div>
</nav>
Ответ написан
2 комментария
2 комментария
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
Вакансии с Хабр Карьеры
Тестировщик-стажёр
ITooLabs • Тула
от 35 000 до 40 000 ₽
Fullstack PHP Developer
Smapse Education
от 40 000 до 65 000 ₽
Trainee - IT Support
move2usajobs.com LLC • Лос-Анджелес
от 2 000 до 4 000 $
Ещё вакансии
Заказы с Хабр Фриланса
Дизайн интерьера для заведения
27 апр. 2024, в 21:24
150000 руб./за проект
Нужно добавить несколько параллакс эффектов
27 апр. 2024, в 21:12
500 руб./за проект
Доработать функционал загрузки прайсов в БД
27 апр. 2024, в 20:40
5000 руб./за проект
Ещё заказы