Sebastiano Sebastiano - 10 months ago 33
jQuery Question

Change CSS display on windows resize and toggle

When i use the toggle function and i resize the window the nav still display none, and this resize function doesn't work, any advises ?

$(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 when the click is not on the nav bar desappear, actually desappear only when i click on the svg icon, i try this code but it doesn't work.

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

Here the live page
and here the repo

Answer Source

It looks like you missed a period:


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

Instead of

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

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