David. E David. E - 5 months ago 16
Javascript Question

Disable a jQuery function at a certain screen width

I've been working on a piece of jQuery code for a while and I can't get it to work the way I want. Basically, I want the completely disable this jQuery code below the screen width of 768px.

Here's the code:

$(document).ready(function () {
$(".resp-menu-btn").click(function () {

if ($('.resp-menu-btn').is(':animated')) {
return;
}

if ($('.site-nav').css('display') == 'none') {
$().stop().slideToggle({ "display": "block"}, 600);
$('.site-nav ').stop().slideToggle(600);
}

else {
$().animate({"display": "none"}, 600);
$('.site-nav').slideToggle(600);
}

});
});


I've tried a couple things like:

if(window.innerWidth < 768px) return true;
else return false;


and

if ( $(window).width() > 768) {
myCode
}


but nothing seems to work.

Can you guys give me some pointers on how to achieve the result I'm looking for? Thanks a lot!

Answer

Did you try statement without “px”? I mean you should use like that

 if(window.innerWidth() < 768) return true; else return false;

The window.innerWidth property is read only.