To see JsPhoto in action, please see The JsPhoto Demonstration at eppunormaali.net.
Download JsPhoto 1.3 Installation Package.
To install JsPhoto, unpack the tar.gz file and copy the
files contained in this package to your web server. (Use
UltimateZip to unpack
the file, for example.) The installation
package contains a fully working
myalbum.html photo album. You
can test this photo album also in your very own PC without installing a
web-server. To test the album, open the
myalbum.html file in your web-browser.
Each photograph in the JsPhoto album comes in two different sizes: a small thumbnail image is shown in the index page and a large image is shown when the user clicks on a thumbnail. The thumbnail image should be at most 122x90 pixels in size, and the large image should be at most 935x635 pixels. Images that exceed these limits are automatically resized to fit the available screen space.
Each JsPhoto album requires a parameter file, which defines the
pictures that belong to the photo album. Create this parameter file by
myalbum.js file from the installation package to
an appropriate name, and edit the file using your favourite text
editor. The file should contain:
/* base directory (URL) containing images, leave empty to use current dir */ jsphotodir = ""; /* title of gallery */ jsphototitle = "Kuopio at summer"; /* array of photos */ jsphotoalbum = new Array( /* thumbnail large image title placeholder */ "thumbnail1.jpg", "natural1.jpg", "North of Puijo", "", "thumbnail2.jpg", "natural2.jpg", "Kuopio city", ""/*<--no comma*/ ); /* name of a cookie to track visited photos */ jsphotocookiename = "jsphotomyalbum"; /* uncomment to use the same style sheet irrespective of the resolution */ //jsphotocss = "small.css"; /* uncomment to set maximum size of an image irrespective of the resolution */ //jsphotomaxw = 740; //jsphotomaxh = 420; /* uncomment to set the number of thumbnails irrespective of the resolution */ //jsphotothumbsx = 4; //jsphotothumbsy = 3;
Modify the template parameter file as follows:
JsPhoto albums are embedded into HTML pages those may contain
additional images and text provided by you. To create this HTML
myalbum.html file from the distribution package
to an appropriate
name and edit the file in a text editor. The file should countain:
In line 5, replace the
myalbum.js with the name of
the .js file that you created earlier.
To use Finnish language in your photo album, insert the following HTML code just prior to /head tag:
Try the photo album by loading the HTML page into the web browser. If
errors. Often, these errors reveal the source of the problem. Once you
see the images, modify titles and colors of the HTML file according
to your taste. If you want to modify JsPhoto style, please
note that the
normal.css files each contain a style
for one resolution. Unless you have fixed the resolution, the colors and
font sizes have to be specified separately to each file.