View Full Version : Lightbox - Conflicting Scripts?

11-21-2008, 03:46 AM
Hi there, I'm trying to use Lightbox on one of my pages, but when I've tried implementing it, there's an error with one of my current scripts.

I currently use this script for the image map on my page:

function ShowMapAreaDiv()

var args=this.params, areas=document.getElementById( args[0] ).getElementsByTagName('area');

for(var i=1, len=args.length; i<len; i++)
this.elems[ args[i] ] = document.getElementById(args[i]);

if(!this.elems[ args[i] ])
alert( args[i] +' Not Found');

areas[i-1].onclick=(function(obj, ident)
return function()
var elems=obj.elems;

for(var i in elems)
elems[i].style.display = (elems[i]===elems[ident]) ? 'block' : 'none';

return false;
})(this, args[i]);


Now, I try and link the scripts to lightbox like so:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
<html xmlns="http://www.w3.org/1999/xhtml">

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
<meta http-equiv="Content-Style-Type" content="text/css"/>
<meta http-equiv="Content-Script-Type" content="text/javascript"/>

<title>UK Riding Spots - Bomb The Hills</title>

<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="js/lightbox.js"></script>

<link rel="stylesheet" type="text/css" href="ddlevelsfiles/ddlevelsmenu-base.css" />
<link rel="stylesheet" type="text/css" href="ddlevelsfiles/ddlevelsmenu-topbar.css" />
<link rel="stylesheet" type="text/css" href="uk.css" />

<script type="text/javascript" src="ukcentres.js"></script>

<!--[if IE ]>
<link href="ukie.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="ddlevelsfiles/ddlevelsmenu.js">

* All Levels Navigational Menu- (c) Dynamic Drive DHTML code library (http://www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code


<script type="text/javascript" src="ukmap.js"></script>

But using this code, I get an error, when looking at it in FF's Error Console it says "elems[i].style is undefined - Line 27". As soon as I take away the three ligthbox scripts it works fine again,

anyone know what's wrong here?


11-21-2008, 04:04 AM
Make sure that you've got the right code, also does the error appear in the lightbox code, or another code? Also make sure your not redefining a variable redundantly, and then mistaking one for being a different.

11-21-2008, 04:16 AM
The prototype script library automatically extends many objects. This is probably what has happened here:

for(var i in elems)
elems[i].style.display = (elems[i]===elems[ident]) ? 'block' : 'none';

I believe the workaround is:

for(var i in elems)
elems[i].style.display = (elems[i]===elems[ident]) ? 'block' : 'none';

There could also be other problems. Also, it might just be better to use a subsidiary for(var j=0, elen=elems.length; j<elen; j++) instead of for(var i in elems)