hamburger menu is not working in IOS device but works in other mobile devices (Samsung etc).
It is checked that is not the click function problem in IOS. The menu should be clickable in IOS device. I have tried to use button instead of a href but is still not working.
Code:
<div id="mobile-navigation" style= "cursor:pointer">
<a href="#menu" class="menu-trigger" style= "cursor:pointer"><i class="fa fa-reorder"></i></a>
</div>
JS:
/*----------------------------------------------------*/
/* Navigation
/*----------------------------------------------------*/
if($('header').hasClass('full-width')) {
$('header').attr('data-full', 'yes');
}
if($('header').hasClass('alternative')) {
$('header').attr('data-alt', 'yes');
}
function superFishInit() {
$('#navigation').superfish({
delay: 300, // one second delay on mouseout
animation: {opacity:'show'}, // fade-in and slide-down animation
speed: 200, // animation speed
speedOut: 50 // out animation speed
});
}
function menumobile(){
var winWidth = $(window).width();
if( winWidth < 973 ) {
$('#navigation').removeClass('menu');
$('#navigation li').removeClass('dropdown');
$('header').removeClass('full-width');
$('#navigation').superfish('destroy');
} else {
$('#navigation').addClass('menu');
if($('header').data('full') === "yes" ) {
$('header').addClass('full-width');
}
superFishInit();
}
if( winWidth < 1272 ) {
$('header').addClass('alternative').removeClass('full-width');
} else {
if($('header').data('alt') === "yes" ) {} else {
$('header').removeClass('alternative');
}
}
}
$(window).on('load resize', function() {
menumobile();
});
superFishInit();
/*----------------------------------------------------*/
/* Mobile Navigation
/*----------------------------------------------------*/
var jPanelMenu = $.jPanelMenu({
menu: '#responsive',
animated: false,
duration: 200,
keyboardShortcuts: false,
closeOnContentClick: true
});
// desktop devices
$('.menu-trigger').click(function(e){
e.preventDefault();
var jpm = $(this);
if( jpm.hasClass('active') )
{
jPanelMenu.off();
jpm.removeClass('active');
}
else
{
jPanelMenu.on();
jPanelMenu.open();
jpm.addClass('active');
}
return false;
});
// Removes SuperFish Styles
$('#jPanelMenu-menu').removeClass('sf-menu');
$('#jPanelMenu-menu li ul').removeAttr('style');
$(window).resize(function (){
var winWidth = $(window).width();
var jpmactive = $('.menu-trigger');
if(winWidth>990) {
jPanelMenu.off();
jpmactive.removeClass('active');
}
});
/*----------------------------------------------------*/
/* Stacktable / Responsive Tables Plug-in
/*----------------------------------------------------*/
$('.responsive-table').stacktable();
I have tried many solutions. Can someone help? Thank you
Aucun commentaire:
Enregistrer un commentaire