undefined variable javascript - lightbox
im trying to open a lightbox when webpages loads using the javascript library "lytebox"
here is my code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/开发者_开发百科DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" language="javascript" src="lytebox.js"></script>
<link rel="stylesheet" href="lytebox.css" type="text/css" media="screen" />
<script>
function ShowIntro()
{
$lb.launch('example.jpg','showPrint:true','Orion Nebula','This is my description, which is optional');
}
</script>
</head>
<body onLoad="ShowIntro()">
</body>
</html>
the code works fine on firefox and chrome, but on internet explorer 8 it doesn't works and I get the following error:
Webpage error details
User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.1; WOW64; Trident/4.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; .NET4.0C; .NET4.0E)
Timestamp: Sat, 24 Sep 2011 05:10:04 UTC
Message: '$lb' is undefined
Line: 12
Char: 3
Code: 0
URI: file:///C:/Users/User/Desktop/lytebox_v5.1/lytebox.html
How can I fix it?
p.s. im using lytebox because it doesnt need jquery, and i dont want cause conflicts with other parts on my page (like "videolightbox")
Here's a guess: Lytebox uses window.onload itself in order to set up the $lb variable (you can see this at the very end of the script), and when you do <body onload"..."> you're basically clobbering Lytebox's window.onload function before it has a chance to fire. Here's another SO question that seems to confirm this behavior in IE.
So, how do you add an onload event when Lytebox needs its own? Simon Willison actually came up with a solution seven years ago in a rather classic article. In your case his advice is straightforward to implement:
<body><!-- no onload --->
<script>
var oldonload = window.onload;
if (typeof window.onload != 'function') {
window.onload = ShowIntro;
} else {
window.onload = function() {
if (oldonload) {
oldonload();
}
ShowIntro();
}
}
</script>
</body>
加载中,请稍侯......
精彩评论