@Philin72

Как разрешить автоматическое закрытие dropdown меню в Bootstrap 4, после клика?

Как разрешить автоматическое закрытие dropdown меню в Bootstrap 4, после клика на смартфоне? На компьютере всё закрывается. На смартфоне после клика меня остаётся открытым.

<!-- Главное меню -->
    <div class="container">
      <nav class="navbar fixed-top navbar-expand-lg navbar-dark"
        style="background-color: #2B2C7F; box-shadow: 8px 8px 40px rgba(0, 0, 0, 0.5);">
        <a class="navbar-brand" href="#"><i class="fas fa-home"></i></a>
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent"
          aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
          <span class="navbar-toggler-icon"></span>
        </button>

        <div class="collapse navbar-collapse" id="navbarSupportedContent">
          <ul class="navbar-nav mr-auto">
            <li class="nav-item active">
              <a class="nav-link" data-value="main" href="#">ГЛАВНАЯ <span class="sr-only">(current)</span></a>
            </li>
            <li class="nav-item">
              <a class="nav-link" data-value="news" href="#">НОВОСТИ</a>
            </li>
            <li class="nav-item dropdown">
              <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown"
                aria-haspopup="true" aria-expanded="false">
                ПРОДУКЦИЯ
              </a>
              <div class="dropdown-menu" aria-labelledby="navbarDropdown">
                <a class="dropdown-item" data-value="tovar-1" href="#">ТОВАР 1</a>
                <a class="dropdown-item" data-value="tovar-2" href="#">ТОВАР 2</a>
                <a class="dropdown-item" data-value="tovar-3" href="#">ТОВАР 3</a>
                <a class="dropdown-item" data-value="tovar-4" href="#">ТОВАР 4</a>
              </div>
            </li>
            <li class="nav-item">
              <a class="nav-link" data-value="photo" href="#">ЗАСТОСУВАННЯ</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" data-value="contacts" href="#">КОНТАКТЫ</a>
            </li>
            <li>
              <a class="nav-link" href="mailto:postmaster@gkj.com.ua" style="color: white;"><i class="fas fa-envelope"></i></a>
            </li>
          </ul>
        </div>
      </nav>
    </div>
  • Вопрос задан
  • 35 просмотров
Пригласить эксперта
Ответы на вопрос 1
AntonLitvinenko
@AntonLitvinenko
HTML coder
$('.nav-link').on('click', function(){
    $('.navbar-collapse').collapse('hide');
});
Ответ написан
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы