Simple jQuery and jQuery UI Based Lightbox Plugin - lightbox.ui

An extremely simple Lightbox plugin based on jQuery and jQuery UI. The lightbox can be closed by clicking on the background overlay or the ESC key.

How to use it:

1. Include jQuery library, jQuery UI and lightbox.ui.js on your webpage

<script src="jquery-ui-1.10.3.custom/js/jquery-1.9.1.js"></script>
<script src="jquery-ui-1.10.3.custom/js/jquery-ui-1.10.3.custom.min.js"></script>
<script src="lightbox.ui/lightbox.ui.js"></script>

2. Include required CSS files on your web page

<link rel="stylesheet" type="text/css" href="jquery-ui-1.10.3.custom/css/flick/jquery-ui-1.10.3.custom.min.css">
<link rel="stylesheet" type="text/css" href="lightbox.ui/lightbox.ui.css">

3. The html

<a class="lightbox" href="images/image1.png">
<img alt="Description" title="Image 1" src="images/thumbs/image1.png" alt="image1" />
</a>

4. Call the plugin

<script type="text/javascript">
$(document).ready(function() {	
$(".lightbox").lightboxUi();
});
</script>

Change Log:

v0.0.18 (2013-06-10)

• new fancy features
• Enable ajax loading function 

v0.0.11 (2013-06-10)

• resizable width/height on click

v0.0.8 (2013-06-07)

• adding CSS navigation arrows

---

This awesome jQuery plugin is developed by ochorocho. For more Advanced Usages, please check the demo page or visit the official website.