Marc Marc -5 years ago 92
Javascript Question

Nav disappears when clicking on a button, this only needs to be at < 767

My navigation disappears when clicking on a button, this needs to happen only when the viewport is < 767px. If the viewport is larger than 767px then the viewport doesn't need to be hidden.


var $nav = $('#nav').
prepend('<div class="responsive-nav" style="display:none">Navigation</div>').
on('click', '.responsive-nav, ul a', function(evt) {
if ( === 'a' && $(window).innerWidth() >= 767) {


if ($(window).innerWidth() < 767) {
$('nav ul li').css('display','block');
$('nav ul').hide()
} else {
$('nav ul li').css('display','inline-block');
$('nav ul').show()




I have made an example here for you to see what's happening:

Answer Source returns the tag name in Caps.


....On HTML elements in DOM trees flagged as HTML documents, tagName returns the element name in the uppercase form.

So, here it returns A, change your if() to

if ( === 'A' .....)


if( === 'a'

Updated Fiddle

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download