jquery - Responsive navigation bar using JavaScript is not resizing -

I am trying to create a responsive nav bar using jQuery and whatever I try is not right Does.

jQuery

  $ (function () {var pull = $ ('# bridge' ); Menu = $ ('naval ul'); menuHight = menu.ight (); $ (bridge) .on ('click', function (e) {e.preventDefault (); menu.slideToggle ();}) ; $ (Window). Resize (function () {var w = $ (window). Width (); if (w> 320 & amp; menu.is (': hidden')) {menu.removeAttr (' Style ');}}};}  

HTML

  & lt ; Div id = "cover cleanfix"> <; header = class = "english"> 
 gt; & lt; a href = "..// index .html "> gt; & lt; h1 & gt; & lt; / h1 & gt; & lt; / a & gt; & lt; h2 & gt; & lt; / h2 & gt; & lt; h2 & gt; ;   Lt; nav class = "clearf Ix "& lt; ul class =" clearfix "> 
  CSS   Background: # B 9 DACC; Repeat Background: No Repetition; Position: Relative;} NAL UL {Padding: 0; Margin: 0 Auto; Width: 960px; Background: # B9DACC;} nav li {display: inline; Float: Left ;} NAV single fonts: Family: "coolvittika_regular", aerial, non-serif; color: #fff; display: inline-block; padding: 0 12px; text alignment: center; text-decoration: none; line-height: 4 0px; font-size: 16px;} nav li: last-child one {border: none;} nav a: hover, nav a: active {background-color: # F4C3AB;} nav # # pull {display: any No;}  

I am trying to add style with the most important, @ media queries for the WRD, but this is not giving me reasons Is there any way of indentation I could send?

instead of performing resize operation in Jquery Rather come Try changing doors Using CSS with the help of media queries. Below it's sample. Try it one.

  @ media screen and (max-width: 500 pix) {one side {display: none; } #wp {width: 100%; } // Specify the operation to complete the situation here. }