Install the lightbox scripts and styles in the head of the page as instructed, and install the Photo Album script with these modifications -
Get rid of these two lines from the Photo Album's external script:
Code:
gdiv.onselectphoto=function(imgobj, linkobj){return true} //custom event handler "onselectphoto", invoked when user clicks on an image within gallery
Code:
gdiv.onclick=function(e){return photogallery.defaultselectaction(e, this)} //attach default custom event handler action to "onclick" event
Change this line:
Code:
imageHTML='<a href="'+imgparts[2]+'" target="'+linktarget+'">'+imageHTML+'</a>'
to:
Code:
imageHTML='<a href="'+imgparts[2]+'" title="'+imgparts[1]+'" rel="lightbox" onclick="myLightbox.start(this); return false;">'+imageHTML+'</a>'
Get rid of this stuff:
Code:
//OPTIONAL: Run custom code when an image is clicked on, via "onselectphoto"
//DELETE everything below to disable
//Syntax: function(img, link){}, whereby img points to the image object of the image, and link, its link object, if defined
thepics.onselectphoto=function(img, link){
if (link!=null) //if this image is hyperlinked
window.open(link.href, "", "width=800, height=600, status=1, resizable=1")
return false //cancel default action when clicking on image, by returning false instead of true
}
Make sure to use at least the 1st (thumbnail) and last (larger image) entries for each of the image array items:
Code:
myvacation[0]=["../photo1.jpg", "", "photo1-large.jpg"]
Bookmarks