How to Shrink image size when browser size is reduced

Thread view:

Enable EMail Alerts

Start New Thread

Thread rating:

Bob Richardson - 07 Mar 2005 22:29 GMT

Is it possible for an image to SHRINK (both height and width, keeping same
h/w ratio) when the browser's width is reduced? It's easy to have both h & w
increase, as needed, to fill up 100% of the <td>, but I don't see how to
have the image shrink.

Without JavaScript, the standard seems to be scrollbars when the browser
shrinks. I'd like the picture to shrink in size and avoid the scrollbars.

Reply to this Message

Randy Webb - 07 Mar 2005 23:15 GMT

> Is it possible for an image to SHRINK (both height and width, keeping same
> h/w ratio) when the browser's width is reduced? It's easy to have both h & w
> increase, as needed, to fill up 100% of the <td>, but I don't see how to
> have the image shrink.

Percentages my friend, percentages.

> Without JavaScript, the standard seems to be scrollbars when the browser
> shrinks.

Only for those that know no better, and that may indeed include me.

> I'd like the picture to shrink in size and avoid the scrollbars.

And what exactly does this have to do with Javascript?

<img src="someImage.gif" width="100%">

Signature

Randy
comp.lang.javascript FAQ - http://jibbering.com/faq & newsgroup weekly

Reply to this Message

Bob Richardson - 08 Mar 2005 06:30 GMT

>> Is it possible for an image to SHRINK (both height and width, keeping
>> same
[quoted text clipped - 15 lines]
>
> <img src="someImage.gif" width="100%">

The above is exactly how I've coded the HTML. I think the IMG is 700 pixels
wide. When you expand the size of your browser beyond 700, the picture's
width and height both expand. But when the browser's width is less than 700,
the picture does not shrink. Just scroll bars.

Thus, I thought that perhaps a JavaScript function might work to reduce the
size of the image.

Reply to this Message

Bob Richardson - 08 Mar 2005 06:37 GMT

>>> Is it possible for an image to SHRINK (both height and width, keeping
>>> same
[quoted text clipped - 23 lines]
> Thus, I thought that perhaps a JavaScript function might work to reduce
> the size of the image.

Ah, I see that it shrinks nicely in Firefox, but not IE 6 :(

Reply to this Message

Malkalypse - 01 Apr 2005 00:51 GMT

Hey Bob, did you ever find a solution to this problem? I'm havin
trouble with this one myself.. I've found a few links that claim t
have a solution, but when I try them, they either don't work or I ge
an error message. (I'm assuming I'm doing something wrong, as I a
fairly new to Javascript.)

I would think there would be more information out there on this kind o
thing. I wish I had a way to create dynamically resizeable image conten
without always resorting to Flash. :

--
Malkalyps

Reply to this Message

Webmaster Forum / HTML, CSS, Scripts / JavaScript / March 2005

How to Shrink image size when browser size is reduced