Question

How would I hide a HTML div when the browser window is either maximized or resized greater then 1600px using jquery?

I currently have it set so the div hides when the page is greater then 1600px on load but cannot get it to hide when the window is maximized or resized after the page has loaded. Below is the code I have used:

if ($(window).width() > 1600) {
      $('#next').hide();
  $('#back').hide();
}

Any help would be greatly appreciated.

$(window).bind('resize', function(){

if ($(window).width() > 1600) {
      $('#next').fadeOut();
} else {
  $('#next').fadeIn();
}
});  

Answer 1

Try this code

$(window).bind('resize', function(){

 if ($(window).width() > 1600) {
       $('#next').hide();
   $('#back').hide();
  }

});



$('.work').click(function(){ 
   if ($(window).width() < 1600){
     $('#next').fadeIn('slow'); 
   }
});