Lightbox v3.0 BETA
I have done some modifications to Lightbox v2.0.2 by Lokesh Dhakar to show any content inside a modal, ajax requested lightbox-window.
Examples
This is the normal use of Lightbox. You can show images, single or grouped, in a modal lightbox window.
Now, you can also display any php-requestable content inside a modal lightbox-window
Show some other content
How to use?
Download the latest version lightbox v3.0 BETA
As you did with lightbox v2, simply need to include the required .js-files and the css-stylesheet in your html-header.
Add a rel=”lightbox” attribute to any link tag to activate the lightbox for use with images. For example:
Optional: Use the title attribute if you want to show a caption.
If you have a set of related images that you would like to group, follow step one but additionally include a group name between square brackets in the rel attribute. For example:
No limits to the number of image sets per page or how many images are allowed in each set.
NEW: use the keyword sightbox to show other content
To show other content than images (f.e. my little script testform.php) in a modal lightbox window you simply need a rel-tag width the value sightbox in your link:
You can configure the width and hight of the window (f.e. width=400px, height=290px):
And you can hide the close-button:
How to create a content (.php) file
Please have in mind, that there are to ways, your sightbox - link can be executet:
- A normal click on the link with javascript enabled
- A click on the link with javascript disabled and/or select Open in new window/Tab
In the first case, a AJAX-Request will be executed. The result will be shown in a modal lightbox-window, without reloading the main-page.
In the second case a (new) whole page will be loaded.
You need to separate these two request-types in your php-content file. But there is a easy way to do this:
If the request is executed by AJAX, there will be a $_POST - Variable [’request’] with the value ‘ajax’, else this variable is empty or not defined. Use this to decide weather to give back only the content or the whole page.