title: Javascript @media min size - only activate at a certain window size
body: <p>I have a javascript that I only want to work when window size is a min of 1326px</p>
  
  <p>This is what I did, but it is not working. The script runs regardless of what window size.</p>
  
  <p>If you look at the first two lines, that is what I used to try and detect my window size. </p>
  
  <pre><code>var mq = window.matchMedia( "(min-width: 1326px)" );
  if (mq.matches)
      {
      function openNav() {
          document.getElementById("mySidenav").style.width = "250px";
          document.getElementById("sidebar-loc").style.marginLeft = "250px";
      }
      function closeNav() {
          document.getElementById("mySidenav").style.width = "0";
      document.getElementById("sidebar-loc").style.marginLeft= "0";
      }
      ( function($) {
      $(document).ready(function () {
          slider();
      });
      } ) ( jQuery );
      ( function($) {
      $(window).scroll(function () {
      slider();
      });
      } ) ( jQuery );
      function slider() {
          if (document.body.scrollTop &gt; 700)
              ( function($) {
              $('#sliderr').stop().animate({"margin-left": '0'});
              } ) ( jQuery );
          else
              ( function($) {
              $('#sliderr').stop().animate({"margin-left": '-200'});
              } ) ( jQuery );
      }
      (jQuery);
      ( function($) {
      $(document).ready( function() {
          $("#show_arrow").hide(); //hide your div initially
          $(window).scroll(function() {
              if($(window).scrollTop() &gt; 700) { //scrolled past the other div?
                  $("#show_arrow").show(); //reached the desired point -- show div
              }
              else($(window).scrollTop() &lt; 700) 
                  $("#show_arrow").hide();
          });
      });
      } ) ( jQuery );
      }
  </code></pre>