Famspam is sharing Facebox, a Facebook-style Lightbox useful to display images, DIVs, or entire remote pages using AJAX. The download package comes with the JavaScript and CSS files, a loading image, a close label, four corners, and solid border images.

Implementation Example

1) Load Dependencies – First, you need to load jQuery before Facebox.

<script src="jquery.js" type="text/javascript"></script>
<link href="facebox.css" media="screen" rel="stylesheet" type="text/css"/>
<script src="facebox.js" type="text/javascript"></script>

Read more from this entry…

YoxView is a free image viewer jQuery plugin inspired by Lokesh Dhakar’s Lightbox, that displays images above the website’s content as a the separate layer (lightbox). The plugin is fully configurable and very easy to integrate into any webpage. You just have to prepare the thumbnails, link to their full size images and put them inside a DIV container that has the class yoxview.

Features include:

• Fully configurable
• Images can be pre-cached in the background
• Images are scaled to fit the browser’s window
• Multiple instances of the viewer can be used on the same page
• Multilingual and bidirectional
• Slide-show support
• Keyboard access
• SEO Friendly

YoxView’s chief feature is Ease of use. Ease of use and flexibility, flexibility and ease of use. Its two main features are flexibility and ease of use… and pre-caching. Its three main features are ease of use, flexibility and pre-caching… and an almost fanatical devotion to the user. Its four… no, amongst its features… are such features as ease of use, flexibility… I’ll start again. *

Are you looking for a way to unobtrusively display images and web pages in a Web 2.0 approach of popups? Checkout TopUp, a free JavaScript library that uses JQuery and JQuery UI in order to maintain cross-browser compatibility and compactness. This library has a very easy setup process (only one include required), supports AJAX requests, has the ability of displaying images, flash (from sites like Youtube, SWF and FLV files), movies (QuickTime, Windows Media and Realplayer), iframes, DOM elements and raw HTML, uses TopUp presets keeps your HTML code 100% clean, and also has fancy layouts, animations and transitions.

More features include:

• Can be used along with Prototype (just include TopUp before Prototype)
• Usage of CSS sprites to reduce the amount of image requests to two per layout for faster loading
• Auto-correction of size and position when required
• The possibility to create groups

Bumpbox is a lightbox that besides the support for opening images, html files, FLV videos, and SWF files, can also be used to open PDF files. The integration of the script is quite simple: you add the scripts in the head section of the page, classes to the links that should use bumpbox and define a rel tag with the size that the lightbox should have. The nice thing about this lightbox is that it detects what kind of file you wish to show in the box, so you do not need to specify the type, easing the process of integration.

Do you need to implement a lightbox that has the zoom effect when it is triggered? Take a look at the following resources! Some of the frameworks used to develop the scripts are JQuery, MooTools, and Prototype.

FancyZoom 1.1 is a LightBox designed to view images inline without reloading the web page. It provides a smooth, clean, truly Mac-like effect. It’s very simple to implement in the pages of your website and it doesn’t use any JavaScript libraries.

Features include:

• Easy to implement (requires just two lines of code in your HTML page)
• Focuses on the smoothest, most polished zooming animation possible
• Preloads full-size images in the background on link mouseover
• Offsets the full-size image from the page by drawing a nice drop shadow under it
• Uses Safari 3′s “box-shadow” feature to draw the drop shadow natively, no images required

jQuery plugin: Fancy Zoom – This is the JQuery version of the FancyZoom script. It comes with a few changes:

• Fixed the overlay bug in IE6
• images are resized if size is bigger than document screen
• FancyZoom can be applied directly on an image, no more link wrapper needed.

Zoomy JavaScript based loosely on Fancy Zoom by Cabel Sasser – Developer John Nunemaker rewrote the original FancyZoom script, making some changes to it such as:

• Implementation of box rounded corners
• Works with any HTML (images, text, headings, flash)
• Width and Height of Zoom Box are configurable through optional setting or CSS

The package contains FancyZoom versions for JQuery, MooTools and Prototype.