There was an earlier version of the PHP Gallery that used an array to set the images. I had already combined it with the lightbox script some time ago. Hopefully, they are similar enough that you can take it from there:
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
.slideshow{ /*CSS for DIV containing each image*/
float: left;
width: 100px;
height: 135px;
}
.slideshow img{ /*Change "auto" below to a number (ie: 200px) to hard code dimensions of album images*/
width: 70px;
height: 112px;
}
#navlinks{ /*CSS for DIV containing the navigational links*/
width: 400px;
}
#navlinks a{ /*CSS for each navigational link*/
margin-right: 8px;
margin-bottom: 3px;
font-size: 110%;
}
#navlinks a.current{ /*CSS for currently selected navigational link*/
background-color: yellow;
}
</style>
<link rel="stylesheet" href="lightbox.css" type="text/css" media="screen" />
<script type="text/javascript" src="lightbox.js"></script>
</head>
<body>
<script type="text/javascript">
/***********************************************
* Photo Album script- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* Visit http://www.dynamicDrive.com for hundreds of DHTML scripts
* This notice must stay intact for legal use
***********************************************/
var dimension="2x2" //Specify dimension of gallery (number of images shown), such as 4x2, 3x1 etc
//Specify images:
//galleryarray[x]=["path_to_image", "optional_title_attribute", "optional_text_description", "optional_link"]
var galleryarray=new Array()
galleryarray[0]=["../thumb2/photo1.jpg", "optional title", "optional description", "../thumb2/photo1.jpg"]
galleryarray[1]=["../thumb2/photo2.jpg", "optional title", "optional description", "../thumb2/photo2.jpg"]
galleryarray[2]=["../thumb2/photo3.jpg", "optional title", "optional description", "../thumb2/photo3.jpg"]
galleryarray[3]=["../thumb2/photo4.jpg", "optional title", "optional description", "../thumb2/photo4.jpg"]
galleryarray[4]=["../thumb2/photo5.jpg", "optional title", "optional description", "../thumb2/photo5.jpg"]
galleryarray[5]=["../thumb2/photo6.jpg", "optional title", "optional description", "../thumb2/photo6.jpg"]
galleryarray[6]=["../thumb2/photo7.jpg", "optional title", "optional description", "../thumb2/photo7.jpg"]
var href_target="_new" //Enter target attribute of links, if applicable
var totalslots=dimension.split("x")[0]*dimension.split("x")[1]
function buildimage(i){
var tempcontainer=galleryarray[i][3]!=""? '<a href="'+galleryarray[i][3]+'" rel="lightbox">' : ""
tempcontainer+='<img src="'+galleryarray[i][0]+'" border="1" title="'+galleryarray[i][1]+'">'
tempcontainer=galleryarray[i][3]!=""? tempcontainer+'</a>' : tempcontainer
tempcontainer=galleryarray[i][2]!=""? tempcontainer+'<br \/>'+galleryarray[i][2] : tempcontainer
return tempcontainer
}
function jumptopage(p){
var startpoint=(p-1)*totalslots
var y=1;
for (i=0; i<totalslots; i++){
document.getElementById("slide"+i).innerHTML=(typeof galleryarray[startpoint+i]!="undefined")? buildimage(startpoint+i) : ""
}
while(document.getElementById("navlink"+y)!=null){
document.getElementById("navlink"+y).className=""
y++
}
document.getElementById("navlink"+p).className="current"
initLightbox();
}
var curimage=0
for (y=0; y<dimension.split("x")[1]; y++){
for (x=0; x<dimension.split("x")[0]; x++){
if (curimage<galleryarray.length)
document.write('<div id="slide'+curimage+'" class="slideshow">'+buildimage(curimage)+'</div>')
curimage++
}
document.write('<br style="clear: left" />')
}
</script>
<!--Below HTML code refers to the navigational links for the gallery-->
<div id="navlinks">
<script type="text/javascript">
for (i=1; i<Math.ceil(galleryarray.length/totalslots)+1; i++)
document.write('<a id="navlink'+i+'" href="javascript:jumptopage('+i+')\">Page'+i+'</a> ')
document.getElementById("navlink1").className="current"
</script>
</div>
</body>
</html>
I don't have access to a PHP enabled server for testing purposes though one of my paying accounts is so enabled but, I wouldn't want to test on their dime. You should be able to just drop in the code for generating the gallery array from the newer script along with the php link from it into the above in place of the hard coded gallery array.
Junior Coders
Need to combine two scripts
RE: Need to combine two scripts
Originally Posted by jscheuer1
Posting Permissions
Reply With Quote
Bookmarks