advice on jQuery / Css IE 7-8-9 issues

[phonix]

im trying to create a portfolio based website with a stack of floating dynamic staling images, so far i've made it work via jQuery and css for chrome and Firefox (newest release anno. 2012)my issue is (as always) IE 7-8-9, i can't wrap my head around what may break it on this platform, my best guess is it's a jQuery cross issue ?check this jsFiddelor check my online exampel hereWhat im looking for is some advice on where i may go wrong since i now have gray hair trying to figure it out on my own, any advice, ideas, articles etc. are more than welcomethanks in advanceMadsjQuery code:\[code\]$(window).load(function () { plottingData(); resizeImage();});$(window).resize(function () { plottingData(); resizeImage();});function plottingData() { var image = $('.box img'); var divW = $(".box").width(); var divH = $(".box").height(); var imgW = image.width(); var imgH = image.height(); $('.outputText').html('DIV CONTAINER W: ' + divW + ' H: ' + divH + ' :: imgW: ' + imgW + ' : imgH: ' + imgH);}function resizeImage() { $("img").each(function () { var maxWidth = $(".box").width();; // Max width for the image var maxHeight = $(".box").height();; // Max height for the image var maxratio = maxHeight / maxWidth; var width = $(this).width(); // Current image width var height = $(this).height(); // Current image height var curentratio = height / width; // Check if the current width is larger than the max if (curentratio > maxratio) { ratio = maxWidth / width; // get ratio for scaling image /* $(this).css("width", maxWidth); // Set new width $(this).css("height", height *ratio); // Scale height based on ratio */ $(this).css("width", "100%"); $(this).css("height", "auto"); } else { /* ratio = maxHeight / height; // get ratio for scaling image $(this).css("height", maxHeight); // Set new height $(this).css("width", width * ratio); // Scale width based on ratio */ $(this).css("width", "auto"); $(this).css("height", "100%"); } });}\[/code\]