Responsive Full Page Gallery Slideshow Plugin For jQuery - Photo Box
File Size: | 333 KB |
---|---|
Views Total: | 5146 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |

Photo Box is a jQuery plugin that has the ability to display your image gallery in a responsive full page slideshow/lightbox.
Features:
- Responsive design for desktop, tablet, mobile, etc..
- A simple loader GIF for image loading.
- Keyboard arrows and next/pre buttons navigation.
- Touch devices supported.
- CSS3 transforms supported.
- Super simple and easy to use.
Basic Usage:
1. Include the latest version of jQuery library and jQuery Photo Box plugin's files in the html document.
<link rel="stylesheet" type="text/css" href="photobox.css"> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <script src="photobox.js"></script>
2. Create a gallery slideshow by wrapping the images in a container element. The plugin will automatically generate the image captions at the bottom of the gallery slideshow by getting the data from the <a>
tag's title
attribute.
<ul class="gallery"> <li><a href="large-1.jpg" title="Image 001"><img src="thumb-1.jpg" /></a></li> <li><a href="large-2.jpg" title="Image 002"><img src="thumb-2.jpg" /></a></li> <li><a href="large-3.jpg" title="Image 003"><img src="thumb-3.jpg" /></a></li> ... </ul>
3. To initialize the gallery slideshow just call the plugin with one line of Javascript.
<script type="text/javascript"> $( function() { $( '.gallery a' ).photobox(); } ); </script>
This awesome jQuery plugin is developed by itsmikita. For more Advanced Usages, please check the demo page or visit the official website.