CODEWITHSUNDEEP
jquery
DevWizard
DevWizard

Reputation: 695

Change CSS display on windows resize and toggle

When I use the toggle function and I resize the window the nav still displays none, and this resize function doesn't work. Any advice?

$(document).ready(function(){ $("#menu").click(function() { $( ".nav" ).fadeToggle("slow", "linear");});

$(window).resize(function() { if ($(window).width() < 768) { $('.nav').css("display", "none");} else {$('.nav').css("display", "inline-block");}});});

I also want the nav bar to disappear when the click is not on the menu area. It currently disappears only when I click on the svg icon. I tried this code but it doesn't work.

$(document).click(function(event) {if(!$(event.target).is('#menu')) {$(".nav").hide();}});

Here the live page REDACTED and here the repo REDACTED

Upvotes: 0

Views: 356

Answers (1)

zJorge
zJorge

Reputation: 798

It looks like you missed a period:

Try 

$('.nav').css("display", "inline-block");

Instead of

$('nav').css("display", "inline-block");

jQuery is looking for a nav tag instead of a .nav class.

Upvotes: 1

Related Questions