Credits
- The original creators of Leightbox, a lightweight inline div solution to the popular Lightbox ajax solution, from the people at eight.nl.
- Paul van Iterson from Quaint Tech for his article on his Leightbox ‘onLoad hack’.
- Richard from pixelcised for fixing the script.
Scenario
Make your leightbox do an “onLoad” function, meaning, once the page loads, the popup is already popped up.
Solution
step1
Download these files:
step2
Include the above downloaded files in between your HTML <head> </head>
example:
remember the links must be relative to your html file location.
step3
To trigger a normal leightbox popup event:
Insert this to an <a> tag, so your link tag looks like this:
<a href="#" class="lbOn" rel="POPUPDIVNAME">POP LEIGHTBOX</a>
where POPUPDIVNAME is the name of the div that contains your popup contents, and class="lbOn" is the code that triggers leightbox to activate.
To close the leightbox popup:
Insert this to an <a> tag, so your link tag looks like this:
<a href="#" class="lbAction" rel="deactivate">CLOSE LEIGHTBOX</a>
where rel="deactivate" and class="lbAction" is the code that simultaneously triggers leightbox to deactivate.
Sample code for the popup div (inclusive of the close button):
To trigger an “onLoad” leightbox popup event
NOTE: You must insert this AFTER the code for the div tag that contains the onload popup contents (otherwise it will fail to function).
where ONLOADPOPUPDIV is the name of the div that contains your onload popup contents.
that’s it!
Is it possible to have the onload popup load once per IP adress, so return visitors don’t see it again, or so that it doesn’t load when just navigating back to the homepage?
Thanks
— Mario · 06/02/09 07:08 AM · #
Assuming you have a html page, – Use javascript cookies (however doesn’t work for clients who did not enable it in their browser)
Assuming you have server-side scripting at your disposal, – Use sessions available in php and asp.
— pixelcised.com · 06/02/09 09:41 AM · #
Use the PHP session variable and set a cookie. That way at the very least people will only seeit once for everytime they come back to your site.
http://ca2.php.net/session
— Some guy · 11/04/09 01:22 AM · #
This worked beautifully! There’s one more thing I want. Since there’s no way I am good enough to code something that finds out if the user has gone past a certain page, do you have any code to make this close after 30 seconds or so?
Mike
HWolfpack6@comcast.net
— Michael · 27/04/09 10:50 AM · #
It works fine but i have some problems when i have this script running on a page where i use also the jquery javascript.
If i put the script include before the javascript include from jquery then i have errors on my page javascript errors.
When i put then under my javascript includes from jquery then it works fine but then the jquery doesn’t work anymore.
page with errors
www.idx-logistics.nl/test/dutch_contact.aspx
page without errors but whithout the jquery
www.idx-logistics.nl/test/default.aspx
Can somebody help me on this one.
thanks in advance….
Michiel
— Michiel · 02/07/09 10:07 PM · #