Question

Is it possible to detect what width a browser window is and hide an element on page if its lower than 1024?

In JQuery perhaps? 🙂

Answer 1

You can accomplish this using a CSS media query.

@media (max-width: 1024px) {
  #someElement { display:none; }
}

Some older browsers don’t support media queries, so you could use jQuery to accomplish this as well. This example will show/hide the element when the window resizes

<div id="someElement">SOME ELEMENT</div>

<script>
  $(function() {
    $(window).bind("resize", function() {
      $('#someElement').toggle($(this).width() >= 1024);    
    }).trigger("resize");
  });
</script>