title: Using JavaScript to get different behavior depending on page size
body: <p>I'm trying to activate different settings for different screen/browser resolutions based on a bit of JavaScript that offers zoom functionality. I've included the below script within my HTML document but I don't think its working correctly. </p>
  
  <p>What I'm saying is if the screen width is more than 1025px AND the width of the browser is greater than 1025px then change <code>zoomWidth</code> and <code>zoomHeight</code> values.</p>
  
  <p>Where am I going wrong with my IF statement?</p>
  
  <pre><code>&lt;script&gt;
  
  if (screen.width &gt;= 1025 &amp;&amp; (document.documentElement.clientWidth &gt;= 1025)) {
   $(document).ready(function() {
  
      $('.jqzoom').jqzoom({
      zoomWidth: 609,
      zoomHeight:756
      });
  
   });
  }
  
  // Start second IF statement
  
  if (screen.width &lt; 1024 &amp;&amp; document.documentElement.clientWidth &lt; 1024) {
  $(document).ready(function() {
  $('.jqzoom').jqzoom({
  zoomWidth: 200,
  zoomHeight:200
  });
  
  });
  }
  &lt;/script&gt;
  </code></pre>