colorblind
09-06-2006, 06:39 PM
I'm currently redesigning a website for a local common-interest group.
One of the pages is the Pictures section of the site. The page has a small horizontal text menu linking to individual photo albums, but seeing as how the server does not have PHP support, and a minimal number of pages used would be preferred. So I came up with an idea: currently the horizontal menu for the individual albums links to a page full of thumbnails right now, and clicking a thumbnail brings up the full-size image. I would like to make it so clicking an album link will show the album's thumbnails in a small space on the left side of the screen, with the thumbnails above each other [vertically oriented] instead of side-by-side. And then, clicking one of the thumbnails will change a blank image in a larger space on the right side of the screen to the selected thumbnail.
So...
http://home.mchsi.com/~avegen/idea.png
A = the menu of the various albums
B = clicking an album link would open a scrollable vertical set of the thumbnails for that album
C = clicking a thumbnail would bring up the full-sized image to the right.
Ideas? I've tried some Javascript to make the images swap, which would work fine, except I had the thumbnails open up in an IFRAME, so when clicked, they couldn't find the destination [the full-sized image in the parent frame] to open up at.
HTML, Javascript, DHTML, and CSS welcome.
One of the pages is the Pictures section of the site. The page has a small horizontal text menu linking to individual photo albums, but seeing as how the server does not have PHP support, and a minimal number of pages used would be preferred. So I came up with an idea: currently the horizontal menu for the individual albums links to a page full of thumbnails right now, and clicking a thumbnail brings up the full-size image. I would like to make it so clicking an album link will show the album's thumbnails in a small space on the left side of the screen, with the thumbnails above each other [vertically oriented] instead of side-by-side. And then, clicking one of the thumbnails will change a blank image in a larger space on the right side of the screen to the selected thumbnail.
So...
http://home.mchsi.com/~avegen/idea.png
A = the menu of the various albums
B = clicking an album link would open a scrollable vertical set of the thumbnails for that album
C = clicking a thumbnail would bring up the full-sized image to the right.
Ideas? I've tried some Javascript to make the images swap, which would work fine, except I had the thumbnails open up in an IFRAME, so when clicked, they couldn't find the destination [the full-sized image in the parent frame] to open up at.
HTML, Javascript, DHTML, and CSS welcome.