This tutorial will show you how to properly set up a Lightbox Gallery which will load automatically when the page is loaded. This can be done with a single lightbox image or with an entire lightbox gallery. Lightbox 2 is the most recent version which comes with many visual enhancements to improve the look of your image gallery.
How to Make A Lightbox Gallery on Pageload
Place these files into the corresponding areas within your website so that we can reference them with the code below.
<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />
This is the script you use to make the lightbox gallery load automatically right when the page is loaded: (Note: #popup is the ID of your a tag, this can be changed to anything you would like as long as they match)
<!-- show Lightbox Image Details instantly on page load -->
And finally, you need to activate the lightbox gallery with the code below.
<a rel="lightbox" href="http://websitename/images/Image1.jpg" id="popup">Image1</a>
rel="lightbox" calls the script for the lightbox. href="YourImage" is the path to the image you want to open. And finally, id="popup" references the script above telling it to open the lightbox image on pageload.