Display image in form with aspect ration preserved

[Devan]

Ok, third time's the charm today... I've researched it as much as I can without success...

I need to show an image in a form.  I've set up a 'Display' field, with the field containing the path to the image as the source.  For layout reasons, I don't want any image to be wider than 150 pixels, so I have set up the 'Image Width' as being '150'.  I have left the 'Image Height' blank.

We are pretty close.  Where there is no data in the ImageSource field, nothing is displayed which is great.  However, where there IS an image, it seems to be 'stretched' out so the height seems to match the width.

I'd really like the image to be scaled to 150 width but retain the aspect ratio for the height (some are landscape, some are portrait - I don't care about the height of the image).  Is that possible at all?

Cheers,
Devan

[MikeR]

use the following java script, give it a max height and width , it will resize and keep ratio (ie no stretch)


function resize(img, h, w) {                 

                                var elem = img;

                                var newImg = new Image();
                    newImg.src = elem.src;
                    var height = newImg.height;
                    var width = newImg.width;

                    var perc;

                    if (width > height) {                             
                                                frac = (h / width);
                    }
                    else {                 
                                                frac = (w  /height);
                                }

                    elem.width = elem.width * frac;
                    elem.heigth = elem.height * frac;

                }

[DonRidley]

I think NT (NT6 in this case) can handle this without any special coding.

Check out my equate value in my screenshot. 

When I set up my image display like this, the aspect ratio is handled correctly.

Don

[attachment deleted by admin]

[Devan]

Mike & Don,

Thanks for the responses!

Don - My image setup is pretty much exactly as the screenshot you uploaded here.  I thought that CSS automatically retains the aspect ration if you only specify ONLY height or ONLY width?

Strangely, it seems to be setting the height component to be the same as the width for some reason.  I'm on NT6.26...

[Bruce]

which browser are you using Devan?

[Devan]

Bruce - currently working and testing on Chrome 18.0.1025.151 m