javascript responsive menu needs to be refreshed whenever media query point requests change -

wonder if can advise.

i new web design , trying use javascript responsive menu code detailed in tim kadlec's great responsive design book. menu works fine mobile menu , changes full screen upon media query, if move browser window need "refresh" every time make menu state change should be. advise me dong wrong?! many thanks, webstudent :

window.onload = function() {     var nav = document.getelementbyid('nav');      var navitem = nav.getelementsbytagname('li');     //is floated?     var floated = navitem[0].currentstyle ? el.currentstyle['float'] : document.defaultview.getcomputedstyle(navitem[0],null).getpropertyvalue('float');      if (floated != 'left') {         var collapse = document.getelementbyid('nav-collapse');          //toggle class utility function         var classtoggle = function( element, tclass ) {             var classes = element.classname,             pattern = new regexp( tclass );             hasclass = pattern.test( classes );             //toggle class             classes = hasclass ? classes.replace( pattern, '' ) : classes + ' ' + tclass;             element.classname = classes.trim();         };          classtoggle(nav, 'hide');         classtoggle(collapse, 'active');         collapse.onclick = function() {             classtoggle(nav, 'hide');             return false;         }     } }