Сделал для мобильной версии сайта два меню.
Также создал блок (back) который делает затемнение фона при открытии одного из меню.
Переключение между блоками меню реализовал с помощью кода:
$(document).ready(function(){
var back = $('.back');
$.fn.oldtoggle = function () {
var b = arguments;
return this.each(function (i, el) {
a = function () {
var c = 0;
return function () {
b[c++ % b.length].apply(el, arguments)
}
}();
$(el).click(a)
})
};
function func1() {
var $next = $(this).next('nav.menu')
$('nav.menu:visible').not($next).prev().click();
$next.fadeIn(); back.slideToggle(0);};
function func2() {$(this).next('nav.menu').fadeOut(); back.slideToggle(0);};
$('a.mobile-menu').oldtoggle(func1, func2);
});
Как сделать чтобы при клике вне меню оно закрывалось?
Делал так:
$(document).mouseup(function (e) {
var container = $("nav.menu");
if (container.has(e.target).length === 0){
container.hide();
}
});
Но совсем не то что хотелось бы.