Lightbox

The original lightbox script.
Eight years later — still going strong!

Download View on Github

Examples

Two individual images

image-1 image-1

Four image set

How to use

Step 1 - Load the Javascript and CSS

  1. Download and unzip the latest version of Lightbox.
  2. Look inside the js folder to find jquery-1.11.0.min.js and lightbox.min.js and load both of these files. Load jQuery first.
    <script src="js/jquery-1.11.0.min.js"></script>
    <script src="js/lightbox.min.js"></script>
  3. Look inside the css folder to find lightbox.css and load it.
    <link href="css/lightbox.css" rel="stylesheet" />
  4. Look inside the img folder to find close.png, loading.gif, prev.png, and next.png. These files are used in lightbox.css. By default, lightbox.css will look for these images in a folder called img.

Step 2 - Turn it on

Help

Have a feature request?

If you want a feature added, create an issue on Github. Someone else or I might be able to help out. No guarantees.

Found a bug?

If you find a bug, create an issue on Github. Include your operating system and browser version along with detailed steps on how to reproduce the bug.

Can't get Lightbox working?

If you followed the instructions, but still can't get Lightbox working, search Stackoverflow to see if other people have run into the same issue as you. If not, post a new question.

Looking for older versions?

You can access older versions and see a changelog on the Github releases page.

Tweet