can you guide me through making this gallery please?

can somebody guide me through making this simple gallery. i uploaded the one page so that its easier to see. after my frustration with iframes, i've decided to go with an open window approach which i think utilizes both javascript and PHP. what i'd like... is this:

1. when you click on a thumbnail, a new window will appear (height: 610px, width: 550px) showing the enlarged photo.
2. the position of the new window will be at the center of the screen.
3. the new window will also have a set of thumbnails at the top in a horizontally scrolling div or ideally, with an arrow button on the left to scroll left and the same for the right. (no button for "next photo" or "last photo")
4. each photo will be accompanied by a caption which will show above the photo under the thumbnails.
5. clicking on the thumbnails in the new open window will display the enlarged photo with its caption.
6. if the photo is wider than the window, a scrolling bar will appear and scrolls only the photo, not the whole page.
7. a "close window" button will be at the bottom.

http://samplegallery.awardspace.com/GalleryMain.php

i know how to open a new window with javascript, specifying the size etc. but i still dont understand how to do the photo thing where you call up the right photo and caption. i also dont know how to get the right image to appear in the new window depending on which thumbnail is clicked first without creating a seperate page for every photo which is the exact thing im trying to avoid.

all this scripting is so confusing to me. i'd really appreciate any help. :) :)

(the linked photos are not the final ones btw, those ones will be 600px tall and have higher resolutions.)

This is a big project, and nobody is just going to write the script for it. Either learn PHP/MySQL, or go post in the paid work forum.

~Phil~

is it? well, i dont want anyone to do it for me, just set me in the right direction on how. coz when i google it, i get lots of sites offerinh things i dont need, whole gallery/photo album management stuff. i think what i want is pretty simple. thumbnails open a window showing the picture and caption, and then clicking on the other thumbnails which are in a scrolling div will produce the same thing.

im looking for a guide of some sort, someone who can help me, not do it FOR me. id really like to learn how to do this.

Well you seem to have the popup down. The changing of images within the popup will need to be done with JS, could be done with AJAX (look it up). As for the images, you will need to find some way to get all of the filenames of images in a certain directory. There are scripts out there that do this. Once you get the images you will need to use a for loop to echo out the image html onto the page. I use a script that pulls images from a folder, creates thumbnails for any newly added images and it does give you the option to add captions but I believe the captions come from the file name. If you know some CSS and can understand what basic html tags look like you can make the images display any way you like. http://cker.name/galerie/ has the script I'm talking about. See it in action http://students.db.erau.edu/~rodri97f/minibaja/photos.php

that kind of thing can easily be done using flash. I made something similar and in a matter of mins i had the scrolling thing you were on about and that would be the hardest part of it as the image thing would be quite simple. If you need any flash tutorials this is a really good site www.flashkit.com they also have files which people have created and put on their for you to edit as you wish, i think i saw one like that. Anothre option may be searching www.sourceforge.com they have loads of different scripts that you can edit.

i was thinking of doing it differently now but still using javascript. instead of having thumbnails in the new window, i'll just have the thumbnails on the main page and a pop-up in the corner of the screen so that they are still visible for clicking.

i have some questions about this though:

1. is there a way for all thumbnails to open in the same pop-up window so that the screen isnt flooded with pop-ups?
2. if they do all open in the same window, is there a way for the window to adjust to the dimensions as the photo?
3. if its not possible for the windows to adjust to the size of the photo, is it possible to assign window sizes for each photo, then have the previous window closed before the new window is opened?
4. is there a way to position the pop-up window in the top left hand corner of the screen so that the thumbnails are still visible?
5. can i make it so that there is only one javascript command for all thumbs? in a way that when an image is clicked on, the right file will be pulled up by adding the letters "HR_" to the beginning of all image names?
for example. clicking on "IMG_3647.JPG" will pull up "HR_IMG_3647.JPG"; clicking on "firstfloor.JPG" will pull up "HR_firstfloor.JPG"

if i know that all the above are possible using javascript, i'll try to figure it out on my own how. but if i have any further questions, would it still be ok for me to ask?