0

Есть адаптивное меню которое должно сворачиваться при нажатии на триггер(гамбургер) HTML:

<span class="main-nav-trigger">&#9776;</span> ///сам триггер который должен сворачиваться <ul class="horizontal-nav"> <li><a href="#">Home</a></li> <li><a href="#">Work</a></li> <li><a href="#">About</a></li> <li><a href="#">Blog</a></li> <li><a href="#">Contact</a></li> </ul>

Jquery:

$(document).ready(function(){
 function menu() {
  var $trigger = $('.main-nav-trigger'),
      $menu = $('.horizontal-nav');

  $trigger.click(function() {
    $(this).next($menu).slideToggle();
  });
  }});

CSS:

   //trigger
.main-nav-trigger {
  display: none ;
  font-size: 45px;
  color:#fff;
  float: right;
  line-height: 1;
  cursor: pointer;
  transition: color .3s ease-in-out;
}
//media 992 px
@media (max-width: 992px){
  .main-nav-trigger {
    display: block ;
  }

1 ответ 1

2

Попробуй так:

$(document).ready(function(){
   $('.main-nav-trigger').click(function() {
     $(this).next('.horizontal-nav').slideToggle();
   });

});

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.