PDA

View Full Version : Lightbox Image Viewer with PHP Photo Album



JBH
02-11-2006, 03:05 PM
Yep, me again with another merge question.

This time (it looks like it should have been ez) I'm using the PHP Photo Album script to display the thumbnails, and when the visitor clicks on a thumbnail, the Lightbox Image Viewer script SHOULD show the pic in the Lightbox's neat little fashion.

But it's not. :confused: :confused:

Lightbox Image Viewer uses a rel="lightbox" code in its links to tell the page to use it with the Lightbox JS script. I tried to apply the same to the script for the PHP Photo Album code, but the pics open within the windows; not activating the Lightbox Image Viewer function.

The code Im trying to use is:

function buildimage(i){
var tempcontainer=galleryarray[i][3]!=""? '<a href="'+galleryarray[i][3]+'" target="'+href_target+'" rel="lightbox">' : ""

script reference links:
PHP Photo Album (http://www.dynamicdrive.com/dynamicindex4/photoalbum.htm)
Lightbox Image Viewer (http://www.dynamicdrive.com/dynamicindex4/lightbox/index.htm)

Any help? Thx.

jscheuer1
02-12-2006, 06:06 AM
You should at least get rid of:


target="'+href_target+'"

and see what happens.

Also, there could be onload conflicts between the two scripts.

JBH
02-12-2006, 05:11 PM
I've tried removing the target="'+href_target+'", tried to add rel="'+light_box+'" with a rel="lightbox" call function, and I tried minipulating the script as best I can. I can't see where the two scripts would conflict, that was my second guess. Anyways, Im gonna email the author of the Lightbox Image Viewer and see if he can figure it out.

If someone else can fiugure it out, please share it. If the author Lightbox Image Viewer script gets it working, I'll post it for later use.

jscheuer1
02-12-2006, 11:52 PM
The two scripts will conflict if any one or more of these three situations exist:

1 ) They both do something onload in such a way as disables the other scripts ability to perform its onload function(s).

2 ) They both use (a) variable or function name(s) that are the same but defined differently or in a different context.

3 ) One accesses an element changing its properties in such a way as the other script requires be left to its control.

There can be other conflicts. When I get some time I will look at the specifics but, this could potentially be a real project, well beyond a simple question and answer as is the norm for these forums.

jscheuer1
02-13-2006, 05:58 AM
It turns out that it is a variation on number 3 from my last post. This syntax works:


var tempcontainer=galleryarray[i][3]!=""? '<a href="'+galleryarray[i][3]+'" rel="lightbox">' : ""

Assuming that you have the larger sized images defined in the galleryarray as the links, ex:


galleryarray[0]=["../thumb/photo1.jpg", "optional title", "optional description", "../full/photo1.jpg"]

With just this much, lightbox worked on the first 'page' but, any time the page was changed, it would stop working, even switching to page two and back to page one broke it. So, I realized that lightbox needed to be re-inited after each page change. Find this function in the Photo Album script (it is near the end) and add the part shown in red:


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();
}

JBH
02-13-2006, 05:23 PM
Thanks for the help. Works great!
All the people in my unit will be pleased. It's a project for my Reserve unit, an OIF II Photo Album.

Much Thx!

jr_yeo
06-03-2006, 06:10 AM
m a newbie at php and js :(
where should i place this?

galleryarray[0]=["../thumb/photo1.jpg", "optional title", "optional description", "../full/photo1.jpg"]

do i have to enter the thumbnails and the full image manually in the "galleryarray" array? :)

how do can i incorporate the code mentioned above to the combined php album script and lightbox script? :)

tnx :D



<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects"></script>
<script type="text/javascript" src="js/lightbox.js"></script>
<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />




<script src="img/getpics.php" type="text/javascript"></script>

<script type="text/javascript">

/***********************************************
* PHP 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="5x4" //Specify dimension of gallery (number of images shown), such as 4x2, 3x1 etc
var imagepath="img/" //Absolute path to image directory. Include trailing slash (/)
var href_target="new" //Enter target attribute of links, if applicable

//Toggle popup link setting: popupsetting[0 or 1, "pop up window attributes" (if 1)]
var popupsetting=[1, "width=500px, height=400px, scrollbars, resizable"]

//Toggle image description: descriptionprefix[0 or 1, "Text to show" (if 1)]
var descriptionprefix=[0, "Photo "]

//Sort images by date? ("asc", "desc", or "")
//"desc" for example causes the newest images to show up first in the gallery
//"" disables this feature, so images are sorted by file name (default)
var gsortorder=""

//By default, each image hyperlinks to itself.
//However, if you wish them to link to larger versions of themselves
//Specify the directory in which the larger images are located
//The file names of these large images should mirror those of the original
//Enter a blank string ("") to disable this option
var targetlinkdir=""

/////No need to edit beyond here///////////////////

function sortbydate(a, b){ //Sort images function
if (gsortorder=="asc") //sort by file date: older to newer
return new Date(a[1])-new Date(b[1])
else if (gsortorder=="desc") //sort by file date: newer to older
return new Date(b[1])-new Date(a[1])
}

if (gsortorder=="asc" || gsortorder=="desc")
galleryarray.sort(sortbydate)
else
galleryarray.sort()

var totalslots=dimension.split("x")[0]*dimension.split("x")[1]

function buildimage(i){
var imagecompletepath=(targetlinkdir!="")? targetlinkdir+galleryarray[i][0] : imagepath+galleryarray[i][0]
// var tempcontainer='<a href="'+imagecompletepath+'" target="'+href_target+'" onClick="return popuplinkfunc(this)">'
var tempcontainer=galleryarray[i][3]!=""? '<a href="'+galleryarray[i][3]+'" rel="lightbox">' : ""
tempcontainer+='<img src="'+imagepath+galleryarray[i][0]+'" title="'+galleryarray[i][0]+' ['+galleryarray[i][1]+']" />'
tempcontainer+='</a><br />'
// tempcontainer+=(descriptionprefix[0]==1)? descriptionprefix[1]+(i+1) : ""
tempcontainer+=galleryarray[i][0].replace(/\..*$/, '')
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" />')
}

function popuplinkfunc(imgsrc){
if (popupsetting[0]==1){
var popwin=open(imgsrc.href, "popwin", popupsetting[1])
popwin.focus()
return false
}
else
return true
}

</script>




<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>

jscheuer1
06-03-2006, 06:51 AM
You need to configure this variable:


//By default, each image hyperlinks to itself.
//However, if you wish them to link to larger versions of themselves
//Specify the directory in which the larger images are located
//The file names of these large images should mirror those of the original
//Enter a blank string ("") to disable this option
var targetlinkdir=""

To have different images used as the large version. Once you get that much, load up the page and then paste this into the address bar:


javascript:alert(galleryarray[0])

Hit enter, an alert box should pop up with the contents of the first array entry. There should be commas between each item. Don't count a comma in a date, like:

Dec 16, 2005

The first is known as [0][0], the second as [0][1] and so on. Find the position of the large image. If you've done nothing else to add to the array other than to add the variable for the large image directory, this number should work out to be 2.

Then edit the code to reflect that as the large image position, in the above post where it says to do this:


var tempcontainer=galleryarray[i][3]!=""? '<a href="'+galleryarray[i][3]+'" rel="lightbox">' : ""

Change both 3's to the number your little experiment shows is the position of the url for the larger image.

Yaoumei
06-13-2006, 06:09 PM
Image, Date + Time
When I paste javascript:alert(galleryarray[0]) into the address bar, it only shows this information. I have a larger image gallery that works with the normal popup, but it only shows one image name. It lists the name of my image in position [0][0]. However, if I replace the 3's from this code with 0's, it doesn't work.


var tempcontainer=galleryarray[i][3]!=""? '<a href="'+galleryarray[i][3]+'" rel="lightbox">' : ""


It will just get stuck at the loading image.
Example: http://yaoumei.ya.funpic.org/gallery.php



<script src="gallery/guest-sm/getpics.php" type="text/javascript"></script>

<script type="text/javascript">

/***********************************************
* PHP 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="3x2" //Specify dimension of gallery (number of images shown), such as 4x2, 3x1 etc
var imagepath="gallery/guest-sm/" //Absolute path to image directory. Include trailing slash (/)
var href_target="new" //Enter target attribute of links, if applicable

//Toggle popup link setting: popupsetting[0 or 1, "pop up window attributes" (if 1)]
var popupsetting=[1, "width=500px, height=400px, scrollbars, resizable"]

//Toggle image description: descriptionprefix[0 or 1, "Text to show" (if 1)]
var descriptionprefix=[0, "Photo "]

//Sort images by date? ("asc", "desc", or "")
//"desc" for example causes the newest images to show up first in the gallery
//"" disables this feature, so images are sorted by file name (default)
var gsortorder="desc"

//By default, each image hyperlinks to itself.
//However, if you wish them to link to larger versions of themselves
//Specify the directory in which the larger images are located
//The file names of these large images should mirror those of the original
//Enter a blank string ("") to disable this option
var targetlinkdir="gallery/guest-lg/"

/////No need to edit beyond here///////////////////

function sortbydate(a, b){ //Sort images function
if (gsortorder=="asc") //sort by file date: older to newer
return new Date(a[1])-new Date(b[1])
else if (gsortorder=="desc") //sort by file date: newer to older
return new Date(b[1])-new Date(a[1])
}

if (gsortorder=="asc" || gsortorder=="desc")
galleryarray.sort(sortbydate)

var totalslots=dimension.split("x")[0]*dimension.split("x")[1]

function buildimage(i){
var imagecompletepath=(targetlinkdir!="")? targetlinkdir+galleryarray[i][0] : imagepath+galleryarray[i][0]
var tempcontainer=galleryarray[i][0]!=""? '<a href="'+galleryarray[i][0]+'" rel="lightbox">' : ""
//var tempcontainer='<a href="'+imagecompletepath+'" target="'+href_target+'" onClick="return popuplinkfunc(this)">'
tempcontainer+='<img src="'+imagepath+galleryarray[i][0]+'" title="'+galleryarray[i][0]+' ['+galleryarray[i][1]+']" />'
tempcontainer+='</a><br />'
tempcontainer+=(descriptionprefix[0]==1)? descriptionprefix[1]+(i+1) : ""
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" />')
}

function popuplinkfunc(imgsrc){
if (popupsetting[0]==1){
var popwin=open(imgsrc.href, "popwin", popupsetting[1])
popwin.focus()
return false
}
else
return true
}

</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>

Is there something else I need to change in order for it to work?
Or is there something else needed from this commented out code?


//var tempcontainer='<a href="'+imagecompletepath+'" target="'+href_target+'" onClick="return popuplinkfunc(this)">'

Sorry about this, I really know nothing about coding.
Any help would be much appreciated. m(__)m

jscheuer1
06-13-2006, 09:12 PM
I'm not sure what I was thinking but, this will work. You need to have:


var targetlinkdir=""

configured to a real directory that is separate from where the smaller images are, and you need to have all your larger images in there under the same names as the smaller images (follow the instructions for doing this on the demo page*). Then use this function buildimage(i):


function buildimage(i){
var imagecompletepath=(targetlinkdir!="")? targetlinkdir+galleryarray[i][0] : imagepath+galleryarray[i][0]
var tempcontainer='<a href="'+imagecompletepath+'" rel="lightbox">'
tempcontainer+='<img src="'+imagepath+galleryarray[i][0]+'" title="'+galleryarray[i][0]+' ['+galleryarray[i][1]+']" />'
tempcontainer+='</a><br />'
tempcontainer+=(descriptionprefix[0]==1)? descriptionprefix[1]+(i+1) : ""
return tempcontainer
}

Remember though, you need to have the targetlinkdir configured in the script and it must exist and be filled with the larger images.



*
from the Demo Page:
Notes

By default, each image within the gallery simply links to itself. However, if you wish them to link to larger versions of themselves, you can specify an alternate directory in which the larger images are located. The file names of these large images should mirror those of the original. To do this, change the variable of Step 3:

var targetlinkdir=""

to something like:

var targetlinkdir="http://www.mysite.com/largegallery/"

This will cause the script to use the directory above instead when loading the image associated with the thumbnail. Obviously you'll need to create an enlarged version of each image, upload them to this directory, maintaining the same file names as the originals, in order for this to work.

EDIT:

And, I'm not sure where you joined this discussion but, you still need to int the lightbox after these lines in the album script:


for (i=0; i<totalslots; i++){
document.getElementById("slide"+i).innerHTML=(typeof galleryarray[startpoint+i]!="undefined")? buildimage(startpoint+i) : ""
}
initLightbox()

At least that is the init code for most of the lightbox scripts, there are some variations. The above works with the original lightbox and, I believe 2.02, but not with what was called 'lightbox plus'.

Yaoumei
06-21-2006, 07:54 PM
I'm not sure what I was thinking but, this will work.
Thank you so much! It works perfectly now~! :D

7effrey
03-04-2008, 03:35 AM
I still can't make it work. red severeal threats about it and really needs help...


<script src="tumb/getpics.php" type="text/javascript"><script type="text/javascript">

/***********************************************
* PHP 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="3x2" //Specify dimension of gallery (number of images shown), such as 4x2, 3x1 etc
var imagepath="gallery/guest-sm/" //Absolute path to image directory. Include trailing slash (/)
var href_target="new" //Enter target attribute of links, if applicable

//Toggle popup link setting: popupsetting[0 or 1, "pop up window attributes" (if 1)]
var popupsetting=[1, "width=500px, height=400px, scrollbars, resizable"]

//Toggle image description: descriptionprefix[0 or 1, "Text to show" (if 1)]
var descriptionprefix=[0, "Photo "]

//Sort images by date? ("asc", "desc", or "")
//"desc" for example causes the newest images to show up first in the gallery
//"" disables this feature, so images are sorted by file name (default)
var gsortorder="desc"

//By default, each image hyperlinks to itself.
//However, if you wish them to link to larger versions of themselves
//Specify the directory in which the larger images are located
//The file names of these large images should mirror those of the original
//Enter a blank string ("") to disable this option
var targetlinkdir="full/"

/////No need to edit beyond here///////////////////

function sortbydate(a, b){ //Sort images function
if (gsortorder=="asc") //sort by file date: older to newer
return new Date(a[1])-new Date(b[1])
else if (gsortorder=="desc") //sort by file date: newer to older
return new Date(b[1])-new Date(a[1])
}

if (gsortorder=="asc" || gsortorder=="desc")
galleryarray.sort(sortbydate)

var totalslots=dimension.split("x")[0]*dimension.split("x")[1]

function buildimage(i){
var imagecompletepath=(targetlinkdir!="")? targetlinkdir+galleryarray[i][0] : imagepath+galleryarray[i][0]
var tempcontainer='<a href="'+imagecompletepath+'" rel="lightbox">'
tempcontainer+='<img src="'+imagepath+galleryarray[i][0]+'" title="'+galleryarray[i][0]+' ['+galleryarray[i][1]+']" />'
tempcontainer+='</a><br />'
tempcontainer+=(descriptionprefix[0]==1)? descriptionprefix[1]+(i+1) : ""
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" />')
}

function popuplinkfunc(imgsrc){
if (popupsetting[0]==1){
var popwin=open(imgsrc.href, "popwin", popupsetting[1])
popwin.focus()
return false
}
else
return true
}

</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>
</p>
<br />
</div>

that's my code, but i can't even see my pictures....
here's my example: http://7effrey.dk/test/gallery/Jeffrey's%20Birthday%20d.2%20feb%2008/p11.php


thank you

jscheuer1
03-04-2008, 04:24 AM
You forgot this (highlighted) in the head of your page:


<link href="../../style.css" rel="stylesheet" type="text/css" />
<link href="../css/lightbox.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="../js/prototype.js"></script>
<script type="text/javascript" src="../js/scriptaculous.js?load=effects"></script>
<script type="text/javascript" src="../js/lightbox.js"></script>

And your PHP script is messed up because you changed some numbers in it and have the wrong path to the thumbnail directory. You also forgot to close the script tag for getpics.php external script tag. Use this (updated to include a better interface to lightbox):


<script src="tumb/getpics.php" type="text/javascript"></script>
<script type="text/javascript">

/***********************************************
* PHP 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="3x2" //Specify dimension of gallery (number of images shown), such as 4x2, 3x1 etc
var imagepath="http://7effrey.dk/test/gallery/Jeffrey's%20Birthday%20d.2%20feb%2008/tumb/" //Absolute path to image directory. Include trailing slash (/)
var href_target="new" //Enter target attribute of links, if applicable

//Toggle popup link setting: popupsetting[0 or 1, "pop up window attributes" (if 1)]
var popupsetting=[1, "width=500px, height=400px, scrollbars, resizable"]

//Toggle image description: descriptionprefix[0 or 1, "Text to show" (if 1)]
var descriptionprefix=[0, "Photo "]

//Sort images by date? ("asc", "desc", or "")
//"desc" for example causes the newest images to show up first in the gallery
//"" disables this feature, so images are sorted by file name (default)
var gsortorder="desc"

//By default, each image hyperlinks to itself.
//However, if you wish them to link to larger versions of themselves
//Specify the directory in which the larger images are located
//The file names of these large images should mirror those of the original
//Enter a blank string ("") to disable this option
var targetlinkdir="full/"

/////No need to edit beyond here///////////////////

function sortbydate(a, b){ //Sort images function
if (gsortorder=="asc") //sort by file date: older to newer
return new Date(a[1])-new Date(b[1])
else if (gsortorder=="desc") //sort by file date: newer to older
return new Date(b[1])-new Date(a[1])
}

if (gsortorder=="asc" || gsortorder=="desc")
galleryarray.sort(sortbydate)

var totalslots=dimension.split("x")[0]*dimension.split("x")[1]

function buildimage(i){
var imagecompletepath=(targetlinkdir!="")? targetlinkdir+galleryarray[i][0] : imagepath+galleryarray[i][0]
var tempcontainer='<a href="'+imagecompletepath+'" title="'+galleryarray[i][0].replace(/\.[^\.]*$/, '')+'" rel="lightbox" onclick="myLightbox.start(this);return false;">'
tempcontainer+='<img src="'+imagepath+galleryarray[i][0]+'" title="'+galleryarray[i][0]+' ['+galleryarray[i][1]+']" />'
tempcontainer+='</a><br />'
tempcontainer+=(descriptionprefix[0]==1)? descriptionprefix[1]+(i+1) : ""
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"

}

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" />')
}

function popuplinkfunc(imgsrc){
if (popupsetting[0]==1){
var popwin=open(imgsrc.href, "popwin", popupsetting[1])
popwin.focus()
return false
}
else
return true
}

</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>

One other thing for now, the images:


var fileLoadingImage = "images/loading.gif";
var fileBottomNavCloseImage = "images/closelabel.gif";

as configured in lightbox.js are not in the locations specified. Either place them in that location, which would be (for your example page):


http://7effrey.dk/test/gallery/Jeffrey's%20Birthday%20d.2%20feb%2008/images/

or edit lightbox.js to reflect their actual location.

7effrey
03-04-2008, 12:17 PM
Thank you, it works really great now :D

beans
01-18-2009, 01:26 PM
hey guys, total noob here... I know no one has posted here in almost a year so I hope someone sees this.

All I really know is basic html and some dreamweaver tricks, so pardon me if this code is a mess. I got the pairing to work on a blank file, but when I tried to incorporate it into a site I'm building, it fails. Lightbox won't work. If someone can take a look and let me know what I need to fix, I would appreciate it. Here's a link (http://www.funknasty.net/test/test4.html) to the page that needs fixing. I copied the code that works in the post above, and as far as I know, everything is pointing to the right place. I would post the code in here but I don't know how, sorry.

jscheuer1
01-18-2009, 01:49 PM
You are using the wrong version of Lightbox, use this one:

http://www.dynamicdrive.com/dynamicindex4/lightbox2/index.htm

There could also be other problems.

beans
01-18-2009, 01:54 PM
hmmm...I got it to work here (http://www.funknasty.net/lb/) though...

I'll try that one as well, but if anyone knows how to get the one I have in there already to work, I would really appreciate it...wish there was a script that would combine the two without that much fuss.

edit: forget it, got it to work with the new one...thanks for the help


quick question though, how do you get it so that you can click to the next image without having to press the thumbnail, like how the original lightbox is supposed to work when you group images? or is it just not possible? no a big deal but would be nice. what about captions?

jscheuer1
01-18-2009, 07:10 PM
See:

http://www.dynamicdrive.com/forums/showpost.php?p=160300&postcount=5

beans
01-19-2009, 03:17 AM
thanks for the help, I really appreciate it. Another quick question though: is there any reason that adding this stuff in would cause the font in ALL my pages to be bolded? Nothing else has changed except the implementation of the scripts, and everything was fine last night...woke up this morning and everything seemed bolded...EVERYTHING. Any ideas on what could have caused this? here's the root (http://www.funknasty.net) and here's (http://www.funknasty.net/test/) where I'm laying the ground work for the site itself. I don't understand what could have caused this.

jscheuer1
01-19-2009, 03:28 AM
Doesn't look bold to me. What browser are you using?

beans
01-19-2009, 03:58 AM
latest firefox on a mac...checked it in safari too. Lemme check in XP and I'll get back to you. Note, this is just on my page, every other page, like this one, displays text just fine.

beans
01-19-2009, 04:08 AM
this is odd...in xp it comes up fine. FF on my mac and safari still show up kinda bold. any ideas?

jscheuer1
01-19-2009, 05:01 AM
I don't have a Mac. I do have Safari 3 Win though, and it has a default way of showing all text that makes it look a bit on the bold side. Perhaps this is a Mac thing.