Hi, Alexandre... I'm going to be working with having images sized as closely as possible to a user's browser window size and so I'm interested in what you're doing.
I was wondering if the "Dimensions" plug-in might be helpful to simplify what you're trying to do. (And what I'll be trying to do, too. Your code is above my head, for sure). Anyway, I'm going to try to use the Dimensions plug-in, get the users browser size, return that to the server via AJAX or a cookie, then either dynamically create an appropriately size image or pull up one of several sizes that I've already created and stored on the server. Dynamically creating an image of significant size could be too slow. The drawback of creating multiple variations of an image and storing them on the server means sacrificing server space for the images. Not sure which way I'll go. This is for my photography and Real Estate websites. Most viewers want to see as large a photo as possible. And the large photos do have a powerful impact on a viewer. Thoughts? Rick > -----Original Message----- > From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of > Alexandre > Plennevaux > Sent: Tuesday, January 15, 2008 10:40 AM > To: jQuery (English) > Subject: [jQuery] Re: jqmodal autosize to fit contained image in window > > > ok i kind of managed, if anyone interested, i did it like this: > > $('a.jqmodal').bind('click',function(){ > imgPreloader = new Image(); > //var mOffset = $('#modalWindow').show().offset(); > > //$.log("mWidth =" + mWidth); > //$.log("mHeight =" + mHeight); > imgPreloader.onload = function(){ > imgPreloader.onload = null; > var imageWidth = imgPreloader.width; > var imageHeight = imgPreloader.height; > var w = $(window).width() - 100; > var h = $(window).height() - 100; > $.log('screen width =' +w); > $.log('screen height =' +h); > if (imageWidth > w) { > imageHeight = imageHeight * (w / imageWidth); > imageWidth = w; > if (imageHeight > h) { > imageWidth = imageWidth * (h / imageHeight); > imageHeight = h; > } > } > else > if (imageHeight > h) { > imageWidth = imageWidth * (h / imageHeight); > imageHeight = h; > if (imageWidth > w) { > imageHeight = imageHeight * (w / > imageWidth); > imageWidth = w; > } > } > var mWinWidth = parseFloat(imageWidth + > 30); > var mWinHeight = parseFloat(imageHeight > + 60); > var mWinTop = parseFloat((h- > imageHeight))/2; > var mWinLeft = > parseFloat((w-imageWidth))/2; > $.log('mWinTop =' +mWinTop); > $.log('mWinLeft =' + mWinLeft); > $('.jqmWindow').css({ > margin: 0, > width: mWinWidth + 'px', > height: mWinHeight+'px', > top: mWinTop+'px', > left: mWinLeft + 'px' > }); > > > $img = "<img id='TB_Image' src='" + this.src + "' > width='" + imageWidth + "' height='" + imageHeight + "' alt=''/>"; > $('#modalTitle').html(this.title); > $('#modalContent').html($img); > $('#modalWindow').jqmShow(); > > } > imgPreloader.src = $(this).attr("href"); > imgPreloader.title = $(this).attr("title"); > > return false; > });