PDA

View Full Version : Lightbox on Load of Website



Brent
02-13-2008, 01:08 AM
1) Script Title:
Lightbox 2.0
2) Script URL (on DD):
http://www.dynamicdrive.com/dynamicindex4/lightbox2/index.htm
3) Describe problem:
Hello,

I want to let Lightbox start when someone enter's my page (http://www.party-crew.info)

Someone on a Dutch Forum has provided me the next code:

<html>
<head>
<script type="text/javascript">
function openHomeImage()
{
eImage = document.getElementById('homeImage');
myLightbox.start(eImage);
}

window.onload = openHomeImage;
</script>
<style type="text/css">
#homeImageBox
{
display: none;
visibility: hidden;
}
</style>
</head>
<body>
<div id="homeImageBox">
<img src="jouw_plaatje.jpeg" id="homeImage" rel="lightbox" />
</div>
</body>
</html>

I've editted my index.html, but it wouldn't work. The lightbox is showing up, but doesn't load the image.

Can somebody help me?

fwhite
02-13-2008, 01:16 AM
try:


<body onload="openHomeImage();">

jscheuer1
02-13-2008, 01:46 AM
http://www.dynamicdrive.com/forums/showthread.php?t=27432

Brent
02-13-2008, 09:36 AM
as you can see in my page code i've already done this. And it doesn't work..

jscheuer1
02-13-2008, 10:16 AM
as you can see in my page code i've already done this. And it doesn't work..

Yes and no. I agree, your page doesn't work. I agree that perhaps you have read this thread I linked to in my previous post:

http://www.dynamicdrive.com/forums/showthread.php?t=27432

and hopefully, particularly this post from it:

http://www.dynamicdrive.com/forums/showpost.php?p=121500&postcount=4

I disagree that your page shows any attempt to follow the advice given there.

I think perhaps you just missed my post or didn't look at the link in it, or perhaps didn't understand how it differs from what you've already tried.

Brent
02-13-2008, 01:14 PM
Sorry, I didn't saw your message..

I've editted ligthbox.js and also editted my index.html


<script type="text/javascript">

function initLightbox()
{
eImage = document.getElementById('the_first');
myLightbox.start(eImage);
}
</script>



<body bgcolor="#d6d6d6" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onLoad="MM_preloadImages('images/pressed (7).jpg','images/pressed (8).jpg','images/pressed (9).jpg','images/pressed.jpg','images/pressed (2).jpg','images/pressed (3).jpg','images/pressed (4).jpg','images/pressed (5).jpg','images/pressed (6).jpg','images/pressed (10).jpg'); initLightbox();" >


<div id="homeImageBox">
<img src="images/agenda/halfvrlarge.jpg" rel="lightbox" id="the_first" title="Upcoming.."/>
</div>

.. but still the image isn't loading yet...

jscheuer1
02-13-2008, 06:55 PM
You are mixing apples and oranges in at least one, possibly more places. You cannot have this:



<img src="images/agenda/halfvrlarge.jpg" rel="lightbox" id="the_first" title="Upcoming.."/>

even for a normal lightbox link. It has to be a link. More like:


<a href="images/agenda/halfvrlarge.jpg" rel="lightbox" id="the_first" title="Upcoming.."></a>

Also, this (red):



<body bgc . . . eight="0" onLoad="MM_preload . . . ed (10).jpg'); initLightbox();" >

is not required. Get rid of it. The lightbox script does that for you, without conflicting with other onload events.

This isn't required:



<script type="text/javascript">

function initLightbox()
{
eImage = document.getElementById('the_first');
myLightbox.start(eImage);
}
</script>

at all. Get rid of it. Instead, edit your lightbox.js file at the end replacing:


function initLightbox() { myLightbox = new Lightbox(); }
Event.observe(window, 'load', initLightbox, false);

with:


function initLightbox() { myLightbox = new Lightbox();
var firstLight;
if((firstLight=document.getElementById('the_first')) && /^lightbox/.test(firstLight.rel))
firstLight.onclick.apply(firstLight);
}
Event.observe(window, 'load', initLightbox, false);

Brent
02-13-2008, 07:17 PM
Thanks a lot :)

It's finally working now, I editted the .js before, bot not with that code. I've replaced it with another one from you're link, the first mentioned.

Anyhow, thank you!

EDIT: Is it possible to get 2 lightboxes on top of each other? So the users have te click 2 time on "close" before they can acces the page?

jscheuer1
11-11-2010, 12:22 AM
Sorry I didn't get back to you Brent. I'm pretty sure that can be done. If you're still interested, start a new thread, as I'm closing this one.

If anyone is still interested in the original topic (Lightbox on Load of Website), there has been for some time an unofficial Lightbox 2.04a 'firstlight' edition:

http://www.dynamicdrive.com/forums/showthread.php?p=163470#post163470