Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Facebook-style lightbox, built in jQuery
JavaScript Shell
Branch: master
Pull request Compare This branch is 2 commits behind kmcphillips:master.

Fetching latest commit…

Cannot retrieve the latest commit at this time

Failed to load latest commit information.
demo_images
images
javascripts
releases
stylesheets
.gitignore
README.markdown
build_tar.sh
index.html
remote.html

README.markdown

Facebox

Forked by Kimos and can now be found: http://github.com/kimos/facebox

Original Facebox plugin by: http://famspam.com/facebox/

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.

Thanks to the following users for their contributions:

http://github.com/jeroenvandijk/

http://github.com/lelutin/

How to use

Include the Facebox javascript after the jQuery core library.

Include the stylesheet.

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.

Lightbox-ize the links on page load.

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.

Options

Options can be passed into the Facebox call to customize behavior like so:

$('a[rel=facebox]').facebox({
    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).
  • iframe : Load an iframe in the facebox. Requires params like iframe: { href: "http://some-site.com/", klass: "myframe" }

Releases

1.5

Added support for loading iframe hrefs. Contributed by lelutin.

1.4

Merged in jeroenvandijk's changes: Added positionInfo function so localization is easily possible Updated the README to use markdown syntax.

1.3.1

Bugfixes. Fixed IE6 CSS issue for form select elements.

1.3

Forked. Combined slide show functionality with close when clicking outside of the frame.

Something went wrong with that request. Please try again.