PHP Photo Album v2.11 - Thumbnail Size

[wyllomoon]

1) Script Title: PHP Photo Album v2.11

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...photoalbum.htm

3) Describe problem: I'm wondering if there's some way to make custom thumb nails for each image in the album. My images are many different sizes, so sticking with one strict thumbnail size makes some of the thumbnails look squished. Can I have a folder of full size images and a folder with thumb nail images and if so, how would I add this to the script to make it work?

Thanks in advance.

[jscheuer1]

If you're using the built in lightbox, it's fairly simple. Just configure the folder for the main script to be the thumbnail folder. Put your thumbnails in there. Each one should have the same name as their larger versions in another folder. Then configure the onphotoclick function like so:

 onphotoclick:function(thumbref, thumbindex, thumbfilename){
   thumbnailviewer.loadimage("http://www.mysite.com/large/" + thumbfilename, "fit2screen")
  }

where the highlighted path is the path to the larger images on your server.

For more information on this approach, see the supplemental page:

Utilizing the onphotoclick event handler and built in Lightbox

Refer especially to Scenario 2.

One other trick you may or may not want to employ is that regardless of the source of the thumbnail images, whether they're scaled down by the browser from the larger versions or are thumbnails you've created, if they don't all have the same aspect ratio, you can allow the browser to resize them in a relatavistic fashion by only setting one of the two dimensions in the css, or by not setting either dimension, rather setting max-width and max-height for the thumbnails. Either:

.photodiv img{ /*CSS for each image tag*/
border: 0;
width: 200px;
cursor: hand;
cursor: pointer;
}

Or:

.photodiv img{ /*CSS for each image tag*/
border: 0;
max-width: 200px;
max-height: 106px;
cursor: hand;
cursor: pointer;
}

The actual values in both cases are up to you.

This makes it easier to use the full size images as thumbnails. But as a matter of efficiency, it's still better to use actual thumbnails. If their byte load is less than the full size images, the page will load faster and the transition between the virtual pages of the gallery will be faster.

And of course if you're using thumbnails and their native dimensions are acceptable to you, set no dimensions at all. Or if they're all the same dimensions, set those for even faster page loads and transitions.

[wyllomoon]

Thank you very much for taking the time to explain this to me. I got a little confused while reading the instructions and didn't realise that it was right there all along. I appreciate your help!!