Zheleznov
@Zheleznov

Как делать раскрытие и закрытие подменю, при клике по элементу li и переход при клике по ссылке?

Добрый день, помогите пожалуйста решить проблемку с меню.

Нужно сделать так, чтобы в моб.версии при клике на пункт меню li , открывалось внутреннее меню sub-menu.
При втором клике по элементу li - подменю закрывается.
При клике по ссылке li a - происходит просто переход по ссылке

html
<ul class="top-menu">
	<li class="menu-item">
		<a href="">Ссылка с подменю</a>
		<ul class="sub-menu">
			<li><a href="">Ссылка</a></li>
			<li><a href="">Ссылка</a></li>
			<li><a href="">Ссылка</a></li>
		</ul>
	</li>
	<li class="menu-item"><a href="">Ссылка</a></li>
	<li class="menu-item"><a href="">Ссылка</a></li>
</ul>


jQuery
if ($(window).width() <= 1140) {
		$(document).ready(function(){
 		  $('.menu-item > a').click(function(e){
			e.preventDefault();
 			$(this).next('.top-menu li ul').slideToggle();
		  });
		});
}


CSS при разрешении до 1140px
.top-menu li ul {
display:none;
}


Сейчас меню раскрывается, но по ссылке не переходит
  • Вопрос задан
  • 39 просмотров
Пригласить эксперта
Ответы на вопрос 1
@MikUrrey
Это потому, что e.preventDefault();блокирует переход.

А чтобы сработало открытие, затем переход, нужно использовать complete-калбэк в методе slideToggle:
$(this).next('.top-menu li ul').slideToggle(200, function(){
  document.location.href = e.currentTarget.href
})
Ответ написан
Ваш ответ на вопрос

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

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