IE 7 cropping image to dimensions instead of Resizing

I have this really weird and annoying problem with IE 7 which I can’t figure out. I have a page with a bunch of thumbnails and when one is click it is shown in a larger view. In the larger view the user can choose to see the next or previous image without leaving the large view. I use javascript to change the dimensions of the image so that if fits on the screen. This all works fine the first time, it’s just that when the user clicks the next or previous button, the new images still fit into the screen except instead of being resized they are cropped. I tried making the width and height a percentage of the window, but it still only changed the size of the crop. The script I use for resizing the image is below:

[CODE]$(“img#previewimg”).css({display:”block”});
var imga = document.getElementById(“previewimg”);
var imrathdw=imga.height/imga.width;
var imratwdh=imga.width/imga.height;
if ((bwidth-100)*imrathdw<=(bheight-100)&&imga.width>bwidth-100) {
var imwid=(bwidth-100);
var imhig=imwid*imrathdw;
}
else if ((bheight-100)*imratwdh<=(bwidth-100)&&imga.height>bheight-100) {
var imhig=(bheight-100);
var imwid=imhig*imratwdh;
}
else {
var imhig=imga.height
var imwid=imga.width
}
allvarobj.preview_imhig = imhig;
allvarobj.preview_imwid = imwid;
$(“img#previewimg”).css({
width:imwid+”px”,
height:imhig+”px”,
position:’absolute’,
left:((bwidth-imwid)/2)+”px”,
top:(((bheight-imhig)/2))+”px”
});[/CODE]

[B][I]By the way, I’m using the jQuery plugin.[/I][/B]

Basically, it loads the image, gets its dimensions, and then resizes it.

This is the page:
[url]http://interpolerater.co.cc/photography.php[/url]

Click on a thumbnail and then click on either one of the large arrows. Make sure browser window is small enough so that you can see the cropping happen.

Thanks for your help.

Also in #JavaScript _↴