HTML Help

Giraf · Joined: 14 Nov 2008 Posts: 2

I would like to display photographs so that they fill as much as possible of the browser's window. If I specify dimensions on the IMG tag, some people see the picture with a lot of unused space around, and some must scroll to see all of it. Is this possible to achieve by a not-to-complicated HTML / Javascript programming?

Corey Bryant · Posted: Fri Nov 14, 2008 12:46 pm

There would be many problems with this. For example, even if you determine that my resolution is 1920X1200, I have Internet Explorer to display at 1280X1024 (which you cannot determine). And then if you try to enlarge an image based on resolution, it might become distorted.

So you could possibly use a pop-up to help create a specific window size. There are also some JavaScript codes like Auto-Sizing Image Popup Window Script (Automatically Sizes Popup Window to Image), Javascript Popup Image Window, or Cut & Paste JK Pop-up image viewer. Keep in mind some of these might not work on some browsers or browsers that have pop-ups blocked.

_________________
Corey
Toll Free Phone Numbers | Processing Credit Cards | Microsoft Expression Web Blog

Giraf · Joined: 14 Nov 2008 Posts: 2

Thanks! As I suspected, there is no simple way. I was mainly thinking of the case where my picture is too big for the viewer's window. (Many new laptops have a rather low screen, and Windows' toolbars eat up some of it.) Making a pop-up solves the opposite problem. It seems best to specify reasonably small dimensions.

RushdenRotaract · Joined: 20 Dec 2008 Posts: 3

you would be best using a specific size, what you could do is have it as big as possible and then force it to be smaller and link to a full version when you click on it, normally an image viewed on its own in a browser will get as big as it can without scrolling if its bigger than the window and only if you click o it it will become full size so that you have to scroll

thetermy · Joined: 23 Dec 2008 Posts: 4

Giraf wrote: I would like to display photographs so that they fill as much as possible of the browser's window. If I specify dimensions on the IMG tag, some people see the picture with a lot of unused space around, and some must scroll to see all of it. Is this possible to achieve by a not-to-complicated HTML / Javascript programming?

Ignore this if it is unhelpful, but, are you looking for a percentage value?

Code: <img src="yourimage.jpg" width="80%" height="50%">

You can set it within a table or just set it in a new window, with a percentage based width. The best way to maintain quality would be to upload a large image (1500x1500) so that it may be scaled down as apposed to stretched.

I hope this is helpful.