Re: showing larger images in pop up window.
- From: "Jonathan N. Little" <lws4art@xxxxxxxxxxxxx>
- Date: Tue, 17 Jan 2006 14:59:11 -0500
I guess that there is no elegant way to code a link on a thumbnail to display a pop up window with larger image and caption when activated. Although no one said it couldn't be done, the consensus is that I should stick to the tried and true no risk method, and create a separate html page for each larger image, with the caption text.
Why do you assume you need to open up lager picture into a new window?
Seems like a lot of wasted space to have a full screen window display a 4cm x 6cm large image with caption. Of course I could make the image even larger now, if I didn't have to concern myself with the dial-up download times of these images. (The images have been optimized to be 5 to 15 kb each).
First of all cm, in, feet, kilometers means nothing on a webpage! Pixels/unit ratios for image does not determine display size, absolute pixels count for width and height do *with respect to the users monitor resolution *unless constrained with HTML WIDTH and HEIGHT attributes*,(but do not do it for a host of reasons)
An image of 300x300 px on in browser window 400x400 px requires no more bandwidth then full screen is 800x600 px or 1200x1600 px. It is the image that will have the loin share of the bytes and that didn't change.
1) Use server side scripting PHP may be your easiest bet. 2) Make your thumbs and images 3) A simple flat file may do for your, simple tab separated text file
images.txt #ImageID <tab> Thumb <tab> ThmCaption <tab> Image <tab> ImgCaption 1 small1.jpg My Thumbnail big1.jpg My Image of blah 2 small2.jpg My Thumbnail 2 big2.jpg Another Image...
4) Make a thumbnail index page in PHP that reads above text file and creates a listing of thumbnail links that links to a single receiving PHP page to show big image with caption, the PHP will plug in the values from read file/
<div> <a href="bigpage.php?id=<?php echo $id ?>"> <img src="<?php echo $thumb ?>" alt="thumb"><a/> <?php echo $thumbCaption ?> </div>
5) bigpage.php receives query string id=1 uses images.txt to look up record id #1
6) builds page with read values for your bigger picture
<div> <img src="<?php echo $image ?>" alt="the big picture"> <?php echo $imageCaption ?> </div> <p><a href="thumbs.php">Back To Thumbnails</a></p>
7)With a return link on page user can get back to your thumbnails, no need for new window!
Very simple to manage for small scalle db...
In my mostly rural area, only about 30% have high-speed connections, and my site is mainly for them. Download times do MATTER.
Thanks for all of your help.
-- Take care,
Jonathan ------------------- LITTLE WORKS STUDIO http://www.LittleWorksStudio.com .