Search code examples
javascriptinternet-explorer-6image-manipulation

Javascript Image Resize


Does anyone know how to resize images proportionally using JavaScript?

I have tried to modify the DOM by adding attributes height and width on the fly, but seems did not work on IE6.


Solution

  • To modify an image proportionally, simply only alter one of the width/height css properties, leave the other set to auto.

    image.style.width = '50%'
    image.style.height = 'auto'
    

    This will ensure that its aspect ratio remains the same.

    Bear in mind that browsers tend to suck at resizing images nicely - you'll probably find that your resized image looks horrible.