Lightbox conflicting with another script?
1) Script Title: Lightbox image viewer
2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...tbox/index.htm
3) Describe problem:
I am creating a photo album website and have been using the "Lightbox" image viewer script very successfully. I have come across one slight problem though - on the site's homepage only, I have also used a random image javascript to place one of a selection of pics at the top of the page when it loads or is refreshed. When I try to use Lightbox to display a pic on the homepage it will not work - the pic just opens up without the lightbox effect. It would appear that the random script and the Lightbox script are in conflict somehow as Lightbox works perfectly well on all the other pages.
It is not a major headache for me if I cannot get Lightbox working on the homepage as it is not one of the main album pages but is there anything simple I can do to avoid this conflict of scripts and get it working?
-- in Head section of homepage --
<head>
<link rel="stylesheet" href="lightbox.css" type="text/css" media="screen" />
<script type="text/javascript" src="lightbox.js"></script>
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
var randomTWD = 0;
var DoIt = 0;
images = new Array;
images[1] = new Image();
images[1].src = "pic1.jpg";
images[2] = new Image();
images[2].src = "pic2.jpg";
images[3] = new Image();
images[3].src = "pic3.jpg";
images[4] = new Image();
images[4].src = "pic4.jpg";
images[5] = new Image();
images[5].src = "pic5.jpg";
images[6] = new Image();
images[6].src = "pic6.jpg";
images[7] = new Image();
images[7].src = "pic7.jpg";
images[8] = new Image();
images[8].src = "pic8.jpg";
images[9] = new Image();
images[9].src = "pic9.jpg";
images[10] = new Image();
images[10].src = "pic10.jpg";
images[11] = new Image();
images[11].src = "pic11.jpg";
images[12] = new Image();
images[12].src = "pic12.jpg";
images[13] = new Image();
images[13].src = "pic13.jpg";
images[14] = new Image();
images[14].src = "pic14.jpg";
images[15] = new Image();
images[15].src = "pic16.jpg";
images[15] = new Image();
images[15].src = "pic16.jpg";
function TWDpics() {
var imgnum = images.length - 1;
do {
var randnum = Math.random();
randomTWD = Math.round((imgnum - 1) * randnum) + 1;
} while (randomTWD == DoIt);
DoIt = randomTWD;
document.ImageHolder.src = images[DoIt].src;
}
// End -->
</script>
-- In body section where random image displays --
<img name="ImageHolder" src="clear.gif" width="600" height="200" border="0"></td>
-- In body section where link to "Lightbox" photo is --
<a href="photo.jpg" rel="lightbox">Click this photo</a>
CSS Codes
Reply With Quote
Yes, you're right I did forget to include this bit in my post .....
Bookmarks