Я использую Slicknav: http://slicknav.com/Получение мобильного меню оставаться открытым при нажатии подменю - Slicknav
Я почти все имеют право поведение, но не совсем. Я хочу, чтобы меню закрывалось всякий раз, когда кто-то нажимал на него, и я получил его, за исключением того, что теперь, когда я применял это, меню закрывается, когда я пытаюсь открыть подменю. Мне нужно получить его там, где все меню остается открытым при нажатии подменю, а также закрывается, когда кто-то щелкает за пределами меню (где-либо еще на странице). Есть идеи?
<ul id="menu">
<li><a href="">link</a></li>
<li><a href="">link</a></li>
<li>
<a href="">Submenu</a>
<ul>
<li><a href="">Submenu link</a></li>
<li><a href="">Submenu link</a></li>
<li><a href="">Submenu link</a></li>
</ul>
</li>
<li><a href="">link</a></li>
<li><a href="">link</a></li>
</ul>
<script src="slicknav.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#menu').slicknav({
label:'',
closeOnClick:true
});
});
/* close menu on outside click*/
$("div, html").on("click", function (event) {
event.stopPropagation();
if(!$(event.target).hasClass("#menu a") &&
!$(event.target).hasClass("ul.slicknav_nav li a") &&
!$(event.target).hasClass("slicknav_menutxt") &&
!$(event.target).hasClass("slicknav_icon") &&
!$(event.target).hasClass("slicknav_icon-bar") &&
!$(event.target).hasClass("slicknav_btn")) {
$("#menu").slicknav('close');
}
});
</script>
Это зафиксировал его:
document.addEventListener('touchstart', onDocumentTouchStart, false);
function onDocumentTouchStart(event) {
if (event.touches[0] && event.touches[0].target.tagName.toLowerCase() == "div") {
$("#menu").slicknav('close');
}
}
Спасибо за тонну. Он отлично работает на моем Android, но, к сожалению, не на моем Ipad. Не уверен, что делать с устройствами ios. – user1610904
Попробуйте это http://stackoverflow.com/questions/9580267/mobile-safari-event-target-in-touch-event – potatopeelings