Using JavaScript to get different behavior depending on page size
<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>
