jquery expanding and resizing problem
<p>Im using this jquery to try and control how wide and high a div opens depending on the screen resolution this is the code im using but it doesn't seem to be having any effect apart from cropping my image. I say it doesnt seem to work becuase it leaves a big space and when I look at firebug it tells me the box has expanded to the 600px x 488px when im viewing in the lower resolution. </p>

<p>Im not sure if the images are pushing the div out the that size because the pictures are exactly 600px x 488px but I need them to be the same file just smaller for dynamic PHP gallery updating in the future, how can I fix this code and how can I easily resize the images depending on the resolution?</p>

<pre><code>$(document).ready(function(){
if ((screen.width&gt;=1440) &amp;&amp; (screen.height&gt;=764)) {


$("#slideshow_box")
    .animate({"height": "600px"}, 500)
    .animate({"width": "488px"}, 500);

}
else  {

$("#slideshow_box")
    .animate({"height": "400px"}, 500)
    .animate({"width": "288px"}, 500);


}
});
</code></pre>
