Picture size according to screen/resolution

[lala56]

I would like to make sure all the pictures on one webpage show without the need to scroll down. They should be as big as the size permits. Also, I would like to keep this site as simple as possible and not create different versions for different user agents etc...

Is it possible to use the same page for any user agent/screen size/resolution, but to let the pictures adjust to each situation? If so, please let me know. That would be marvellous.

lala

 

[temi]

Lala, I would actually argue that if the entire contents of the index page can fit onto the screen without the need to scroll is even better, I can quite remember the percentage off hand but most people do not scroll at all and those who do scroll will prefer they do not have to scroll to view info on a page.

 

[melkior_inactive]

I think what you're asking for can be achieved using PHP.
Theoratically let's say you're using the database to feed the script with images.
So images are in one table. They are already small (thumbnails).
You would proceed to create a script which aligns them in a HTML table, each image in its own cell.
You do this with an SQL query with a while loop to create the table.
You also need an SQL query to get the number of images. So you can dynamically adjust the number of cells in a row and you can dynamically adjust the image size with the width and height atributes of the img tag.
You'll need an accurate calculation for the resize percentage based on the number of images but it can work.

 

[lala56]

Thanks for the input.

On this particular page are just images and we would love to achieve the same thing using HTML and CSS only (obviously only if possible;-)). That would be marvellous. If anyone has an idea, please let me know.

lala

 

[melkior_inactive]

Well, you don't really need to put them in a table. I was using the table as an example. You can use CSS, the basic idea is still the same.

 

[OldWelshGuy]

Why not just use browser detection and resize the whole site?

 

[inactive_jumpenjuhosaphat]

You can also use CSS/HTML to stretch and shrink your image. I believe that you just need to use the width attribute, but there might need to be a position: declaration as well, I'm not sure.

 

[lala56]

On this particular project we cannot use PHP (not included in the hosting package of my friend). Browser detection would mean to have different versions of the site, which we would like to avoid.

I have to admit, I might be in wonderland with my aspirations there....

lala