Facebook-style lightbox, built in jQuery
JavaScript Shell
Switch branches/tags
Nothing to show
Pull request Compare This branch is 19 commits ahead, 48 commits behind defunkt:master.
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Failed to load latest commit information.


 === Facebox ===

Original Facebox plugin by:

Forked by Kimos and can now be found:

A Facebook-style Ligthbox script for jQuery.

This fork combines the support for multiple images to be viewed as a gallery and for closing the modal window when clicking outside of the Facebox.

Requires at least jQuery 1.2

Numbered versions can be found in the 'releases' folder with all included images/scripts/stylesheets.

 === How to use ===

Include the Facebox javascript after the jQuery core library.
<script src="javascripts/facebox.js" type="text/javascript"></script>

Include the stylesheet.
<link href="stylesheets/facebox.css" rel="stylesheet" type="text/css" />

Copy over all the images from the images folder. Edit the .css file to match your directory structure if required.

Specify links to be shown in the Facebox by adding the rel="facebox" attribute.
<a href="path/to/image.jpg" rel="facebox"><img src="path/to/thumbnail.jpg" /></a>

Lightbox-ize the links on page load. 
<script type="text/javascript">
  $(document).ready(function($) {

All objects on the page with the same rel tag will be turned into a gallery/slideshow with arrows to browse and click on the image to go to next. If you wish to have multiple different and disconnected faceboxes on a single page just give them all different rel tags and load them separately.
<script type="text/javascript">
  $(document).ready(function($) {

 === Options ===

Options can be passed into the Facebox call to customize behavior like so:
  option: 'value',
  anotherOption: 'another value'

Supported options are:
      opacity       : Opacity amount
      overlay       : Overlay boolean
      loadingImage  : Path to override the default throbber/loading image
      closeImage    : Path to override the default close image
      nextImage     : Path to override the default next arrow image for the gallery
      previousImage : Path to override the default previous arrow image for the gallery
      imageTypes    : Array of strings which represent the file extensions to be recognized as images.
      faceboxHtml   : Block of HTML to draw as the Facebox overlay. (this should not be changed unless you know what elements are expected with what CSS attributes).