My cropping image function works just after loading the image but not
during window resizing. The problem is if there's a width="100%"
somewhere in the page but no height="100%", enlarging vertical only
adds white space instead of cropping larger. Any size calculation
based on actual values fails so I need a way to determine the optimal
size without white space on unlimited screen size. Is this somehow
possible?
$.fn.cropImage = function (maxW, maxH, minW, minH) {
var w = $(this).width();
var h = $(this).height();
var winW = document.body.clientWidth;
var docW = document.body.scrollWidth;
var availW = w + (winW - docW);
var winH = document.body.clientHeight;
var docH = document.body.scrollHeight;
var availH = h + (winH - docH);
availW = Math.max (Math.min (Number(maxW), Number(availW)),
Number(minW));
availH = Math.max (Math.min (Number(maxH), Number(availH)),
Number(minH));
var scale = Math.min (availW / w, availH / h);
w = w * scale;
h = h * scale;
$(this).css ({width:w, height:h});
}
Does anybody have a better idea how to determine the cropping scale
based on actual window size?
O. Wyss