Lightbox Without Framework
Design of a lightbox
to present images, a message, a form to highlight it by darkening the rest
of the page.
Without Ajax framework, with a few lines of code.
Scripts tested with Internet Explorer, Firefox, Chrome, Opera, Safari and Konqueror.
are created, one for the filter that darkens the page, the other as a box
Just some CSS descriptors are required to create a lightbox.
It plays on the display:block and display:none properties to display or remove the box and the filter.
To change the content
of the lightbox at the user request and depending on his choicer, a few
It includes a title in the bar and insert the content using DOM functions.
The lightbox is redefined and simplified for displaying only images, which
is the most common use in fact.
In this case you click on the image to close the box, that simplifies the design.
We must make the code more complicated to support older browsers.
By adding an Ajax function - without using a framework - we can display images instantly in the box.
For the lightbox appearing gradually, a fade in effect is added to the previous Ajax version.
Presenting a form in a lightbox, possibly with a fade effect, should alleviate the inconvenience it is to fill it ...
© 2009-2013 Xul.fr