Touch Friendly Mobile Gallery Plugin with jQuery and CSS3 - touchTouch

Touch Friendly Mobile Gallery Plugin with jQuery and CSS3 - touchTouch
File Size: 53.9 KB
Views Total:
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   

touchTouch is a clean and responsive jQuery gallery plugin which helps you to create an amazing Touch-Friendly image gallery with smooth CSS3 animations and lightbox effect.

Features:

  • Responsive Design
  • Support for CSS3 animations and transitions
  • Preloads photos only when they are needed
  • Support for swiping through photos
  • Support for arrow key navigation

Basic Usage:

1. Markup Html Structure

<div class="thumbs"> 
<a href="1.jpg" style="background-image:url(thumnails/1.jpg)" title="Title 1"></a>
<a href="2.jpg" style="background-image:url(thumnails/2.jpg)" title="Title 1"></a>
<a href="3.jpg" style="background-image:url(thumnails/3.jpg)" title="Title 1"></a>
...
</div>

2. Include jQuery touchTouch CSS on your page

<link rel="stylesheet" href="assets/touchTouch/touchTouch.css" />

3. Include jQuery library and jQuery touchTouch on your page

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> 
<script src="assets/touchTouch/touchTouch.jquery.js"></script> 

4. Initialize the gallery

$(function(){

$('.thumbs a').touchTouch();

});

More Examples:

  • Single Gallery Example
  • Multiple Galleries Example

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