40+ Useful jQuery Lightbox Plugins

June 6, 2013 · 7 comments

by Sonny M. Day

jQuery lightbox plugins are used for presenting images, videos and html content in an elegant and very focused way. A page with lightbox enabled elements e.g. images a user click will open a modal window where a larger version of the image is presented. The advantages are obvious as users are not required to leave the page to view the content presented by the lightbox and because the area around the featured element is typically faded out, focus is increased at what is important. Some image lightbox plugins even include gallery capabilities and allow visitors to browse through a set of images from a lightbox control panel.

Online marketers have picked the lightbox technique up and use the modal windows to present their email signup forms, social like/follow requests etc. as a non blockable popup effect. There are many plugins for e.g. WordPress to quickly implement popup style solutions like this.

The lightbox features was initially implemented the hard way in JavaScripts but as popularity grew most of the solutions were created using frameworks like jQuery and this way they are much simpler to use on a web page.

Another popular and related way to create dynamic web pages is using jQuery tooltips. While lightboxes are often configured to open up and close when clicked tooltips are often activated on mouse over. Further, they are not typically designed to fade out the entire page but simply add the tooltip next to the element it is attached to.

Below you will find a useful selection of jQuery lightbox plugins. Please let us know in a comment if we missed some great resources!

Disclosure: Please note that some of the links below are affiliate links and I will earn a commission if you purchase through those links (at no extra cost to you). I recommend that you do your own independent research before purchasing any product or service. This article is not a guideline, a recommendation or endorsement of specific products.


ElegantThemes
ThemeForest

Advertisement

iLightBox · Revolutionary Lightbox Plugin – MORE INFO / DEMO

ILIGHTBOX

iLightBox allows you to easily create the most beautiful responsive overlay windows using the jQuery JavaScript library.

jQuery Speedo Popup – MORE INFO / DEMO

JQUERY

Speedo popup is a small, powerful and real customizable jQuery popup / modal plugin.

Showcase v1.2 – MORE INFO / DEMO

SHOWCASE

Showcase offers over 60 animation settings that can be applied to each Bullet, providing the maximum level of customization possible.

jQuery UI Modal – MORE INFO / DEMO

UI-MODAL

jQuery UI Modal is plugin of jQuery UI. It easy to create modal functionality to the web application (example the modal form …) and to replace the basic functionality provided by the standard javascript alert(), confirm(), and prompt() functions.

Titan Lightbox – MORE INFO / DEMO

TITAN-LIGHTBOX

TITAN is an awesome lightbox gallery script which supports a wide assortment of images, html content, maps, and videos. It is built around jQuery HTML5 and is both easy to implement and customize.

Smart Notification | jQuery Plugin – MORE INFO / DEMO

image

Smart Notification is a jQuery plugin. It is an advanced pop-up notifications. With the ability to add video.

HoverAlls v1.3 – MORE INFO / DEMO

hoveralls

HoverAlls is a unique jQuery animation plugin that allows you to create animation effects quickly – without any knowledge of Javascript or jQuery. With over 40 settings, HoverAlls can create unique animations for nearly any type of effect desired.

Repose Showcase – MORE INFO / DEMO

REPOSE-SHOWCASE

Repose is a javascript plugin which can be used as an amazing showcase for different stuff. Some awesome stuff that can be showcased using Repose would be portfolio, images, social links, your team, your USP or features, or pricing tables.

JQuery Thumbnail Gallery With LightBox – MORE INFO / DEMO

THUMBNAIL

Comes in two layout types (grid and line, vertical and horizontal), with scroll (jScrollPane) or buttonnavigation. Thumbnail boxes support any HTML element inside them.

Dynamic Lightbox – MORE INFO / DEMO

DYNAMIC

Dynamic Lightbox offers you an application with a visual editor to create almost any kind of custom lightbox with just one file!This provides virtually unlimited options.

Responsive Tile Gallery – MORE INFO / DEMO

TILE-GALLERY

Responsive Tile Gallery is a completely responsive image gallery. It allows your visitors to easily sort and view all of your images. It also allows you to put your images into categories, load thumbnails instead of full resolution images, and develop responsive websites for all platforms.

Responsive Slideshow Photo Gallery Grid – MORE INFO / DEMO

SLIDESHOW

The Responsive Slideshow Photo Gallery has a fluid / flexible / responsive layout.

Megafolio Pro Responsive Grid JQuery Plugin – MORE INFO / DEMO

MEGAFOLIO

Megafolio Pro is a fully responsive media grid plugin that allows you to display content in almost every way possible using preset or randomly generated layouts.

JackBox – Responsive Lightbox – MORE INFO / DEMO

JACKBOX

Create a lightbox that worked on mobile devices, even smartphones. JackBox is “responsive”, which means it’s 100% compatible with responsive websites.

JBMarket Image Gallery – MORE INFO / DEMO

JBMARKET

JBMarket Image Gallery is JavaScript (jQuery based) script converting unordered list into an Image Gallery with Lightbox.

jQuery Giga Image Viewer – animated zoom and pan – MORE INFO / DEMO

GIGA-IMAGE

The giga image viewer jQuery plugin allows you to easily replace <div> tags with animated image viewers with hotspots.

adPopup Pro for jQuery – MORE INFO / DEMO

ADPOPUP

adPopup Pro is a jQuery plugin to show ads (or information) in popups to your visitors. The plugin has browser detection, OS detection, screen size detection, tablet detection, mobile detection and more built-in to show the popup only to the visitors you want to.

MetroBox – Responsive LightBox – MORE INFO / DEMO

METROBOX
MetroBox is a jQuery plugin for displaying photos/videos or anything you want with visitor/user comments ( like social network features ).

Dialog – MORE INFO

DIALOG

Flare Responsive Mobile-Optimized Lightbox Plugin – MORE INFO / DEMO

flare-jquery-lightbox

Flare – a custom responsive, touch enabled, mobile optimized lightbox jQuery plugin, which can be used to display single images/videos or entire galleries.

jQuery CSS3 Lightbox Gallery Plugin – MORE INFO / DEMO

jquery-css3-lightbox-plugins

The CSS3 Lightbox is a jQuery plugin you can use to display your images. The CSS3 transitions is driven by Animate.css, it is hardware accelerated in the modern browser. And It’s mobile friendly, which works in your touch device like iPhone & iPad.

Highslide JS – MORE INFO

high-slide-js

Highslide JS is an image, media and gallery viewer with lots of configuration options. Among others it features single click feature where after the image has been opened or HTML popup, the user can scroll further down or leave the page without closing it. Also, it has outstanding, unconditional and free user support for both commercial and non-commercial users. – Free Plugin

jQuery Lightbox Grooveshark Style – MORE INFO / DEMO

jquery-lightbox-grooveshark-style

jQuery Lightbox – Grooveshark Style is a quick, simple, and easy plugin to use for all of your lightbox needs. It is highly customizable, and very intuitive to use. – Premium Plugin by CodeCanyon

GreyBox – MORE INFO

greybox

Greybox is a simple lightbox and displays images and other content in a smooth and  unobtrusive fashion. – Free Plugin

Slimbox 2, the ultimate lightweight Lightbox clone for jQuery – MORE INFO

slimbox-2

Slimbox 2 is a 4 KB visual clone of the popular Lightbox 2 script by Lokesh Dhakar, written using the jQuery javascript library. It was designed to be very small, efficient, standards-friendly, fully customizable, more convenient and 100% compatible with the original Lightbox 2. – Free Plugin

jQuery Lightbox Evolution – MORE INFO

lightbox-evelution

Lightbox Evolution is a tool for displaying images, html content, maps, and videos in a “lightbox” style that floats overtop of web page. Using Lightbox Evolution, website authors can showcase a wide assortment of media in all major browsers without navigating users away from the linking page.

FancyBox – MORE INFO

fancybox

FancyBox is a tool for displaying images, html content and multi-media in a Mac-style “lightbox” that floats overtop of web page. – Free Plugin

Lightview – MORE INFO

lightview

Lightview was built to change the way you overlay content on a website. – Free Plugin

ViewBox – Media Browser – LightBox Alternative – MORE INFO

viewbox

The script is a complex jQuery LightBox Alternative. It offers Photo Galleries, Support for video (YouTube and Vimeo), Built-in player – JW Player, The ability to set keys to control etc.

Lightbox 2 – MORE INFO

lightbox-2      

Lightbox is a simple, unobtrusive script used to overlay images on top of the current page. It’s a snap to setup and works on all modern browsers. – Free Plugin

boxy – Facebook-like dialog/overlay, with frills – MORE INFO

box

Boxy is a flexible, Facebook-style dialog box for jQuery with support for dragging and size tweening. It differs from other overlays I’ve seen by providing an object interface to control dialogs after they’ve been created. And for simple usage scenarios, boxy also provides a jQuery plugin for automatically hooking up links and forms, as well as an ask() helper for presenting multiple choices to the user. 

Lightbox JS – MORE INFO

lightbox-js

Lightbox JS is a simple, unobtrusive script used to overlay images on the current page. It’s a snap to setup and works on all modern browsers.

SimpleModal – MORE INFO

simple-modal

SimpleModal is a lightweight jQuery Plugin which provides a powerful interface for modal dialog development. Think of it as a modal dialog framework. SimpleModal gives you the flexibility to build whatever you can envision, while shielding you from related cross-browser issues inherent with UI development. 

PIROBOX EXTENDED V.1.0 – jQuery plugin – MORE INFO

pirobox

Pirobox is an awesome jQuery lightbox plugin that features a slider functionality. – Free Plugin

ModalBox – MORE INFO

modalbox

ModalBox is a JavaScript library for creating modal dialogs or wizards (sequences of dialogs) without using conventional popups and page reloads. It’s inspired by Mac OS X modal dialogs. It may also be useful for showing bigger versions of images. – Free Plugin

PrettyPhoto – MORE INFO

prettyphoto

PrettyPhoto is a jQuery lightbox clone. Not only does it support images, it also support for videos, flash, YouTube, iframes and ajax. It’s a full blown media lightbox. – Free Plugin

Litebox – MORE INFO

lightbox

Litebox is a modified version of Lightbox v2.0 created with one thing in mind, size reduction. Litebox utilizes the 3kb javascript library moo.fx in association with prototype.lite, giving us the basic tools we need to make this work and you the ability to expand. – Free Plugin

jQuery SuperBox! – MORE INFO

jquery-superbox

jQuery Superbox! is a script which allows you display windows with lightbox effect. – Free Plugin

jQuery lightBox plugin – MORE INFO

jquery-lightbox-plugin

jQuery lightBox plugin is simple, elegant, unobtrusive, no need extra markup and is used to overlay images on the current page through the power and flexibility of jQuery´s selector. – Free Plugin

Fancy Zoom (jQuery) – MORE INFO

fancy-zoom

This works with any html (images, text, headings, flash). The only caveat is it doesn’t currently work with AJAX. Whatever you want to zoom to must be html already on the page.

Author : Sonny Day

Sonny M. Day is a passionate SEO and web design enthusiast who loves photography, mountain climbing, snorkeling and dirt bike riding.

{ 7 comments… read them below or add one }

Shyam August 6, 2013 at 7:19 pm

great

Reply

Daniel June 11, 2013 at 8:17 am

Great list, thanks very much.

Reply

dweb3d.com October 18, 2012 at 8:02 am

Very nice gift, awesome resources, thanks

Reply

yates en Ibiza August 3, 2012 at 11:18 am

The most of them looks very nice. I think the most important plugin is the mobile plugin. Smartphoneusers are a big part of our websites and we have to develop many mobile pages. And a nice look is important for all visitors. So thank you for your helpfull list of nice plugins.

Reply

Shalu Sharma July 18, 2012 at 8:45 am

Amazing set of plugins to display images. I have a travel site and want to displace images, I think a plugin like this would be help tremendously. I am very much inclined to use sliders or gallery type plugins where one can view images quickly. Also plugins where a small image in used and then a larger version of the image is shown is a good idea to reduce size and cluttering on the post.

Reply

Andrew - AgapaStudio June 20, 2013 at 5:25 pm

Hi Sharma,

is not so difficult to have a small image in use and then a larger version of the image to be shown, depend very much of what popup plugin you use. That plugin should have the possibility to call itself using a class tag or inline html. Let`s say you are using SPEEDO Popup plugin, then you could use something like this:

This will trigger the popup and you will load into window box, the big image (BIG-pic.jpg). Also, you can have there a link, and the popup will automatically load the link into an iframe.

By the way, you have above a nice collection to choose from!

Reply

Daniel Walprecht July 17, 2012 at 11:21 pm

Hi,
thats a nice article about the lightboxes. The most of them looks very nice. I think the most important plugin is the mobile plugin. Smartphoneusers are a big part of our websites and we have to develop many mobile pages. And a nice look is important for all visitors. So thank you for your helpfull list of nice plugins.

Reply

Leave a Reply

Your email address will not be published. Required fields are marked *

Previous post:

Next post:


Web Analytics