jquery - Navigation bar doesn't respond on mobile devices -
i'm trying find out why doesn't work on iphone works great on desktop. tried @ crossbrowsertesting.com , works fine on android phones.. not on iphone.
http://codepen.io/marcray/pen/vmjbn
// sticky header $(window).scroll(function() { if ($(window).scrolltop() > 100) { $('.main_h').addclass('sticky'); } else { $('.main_h').removeclass('sticky'); } }); // mobile navigation $('.mobile-toggle').click(function() { if ($('.main_h').hasclass('open-nav')) { $('.main_h').removeclass('open-nav'); } else { $('.main_h').addclass('open-nav'); } }); $('.main_h li a').click(function() { if ($('.main_h').hasclass('open-nav')) { $('.navigation').removeclass('open-nav'); $('.main_h').removeclass('open-nav'); } }); // navigation scroll lijepo radi materem $('nav a').click(function(event) { var id = $(this).attr("href"); var offset = 70; var target = $(id).offset().top - offset; $('html, body').animate({ scrolltop: target }, 500); event.preventdefault(); });
if shown on codepen full html, problem lies within lack of code in html.
create <head>
, insert <meta name="viewport" content="width=device-width, initial-scale=1">
it.
read more on setting viewport - google docs.
Comments
Post a Comment