ZOOM - jQuery photo gallery plugin
Features:
- easy to install and use
- slim design
- animated transition when changing between images
- keyboard shortcuts: arrows for previous/next image and escape for close
- images resize to fit the screen
- compatible with mobile devices
How to use
Include the stylesheet and javascript into the header and add the images (class gallery required, style as desired):
<!DOCTYPE html>
<html dir="ltr" lang="en-US">
<head>
<link rel="stylesheet" href="css/zoom.css" media="all" />
<script src="js/jquery-1.9.1.min.js"></script>
<script src="js/zoom.min.js"></script>
</head>
<body>
<ul class="gallery">
<li><a href="path/to/large1.jpg"><img src="path/to/thumbnail1.jpg" /></a></li>
<li><a href="path/to/large2.jpg"><img src="path/to/thumbnail2.jpg" /></a></li>
<li><a href="path/to/large3.jpg"><img src="path/to/thumbnail3.jpg" /></a></li>
<li><a href="path/to/large4.jpg"><img src="path/to/thumbnail4.jpg" /></a></li>
</ul>
</body>
</html>