Simple Image Sequence Animation Plugin With jQuery - UixSimpleImagesAnim

UixSimpleImagesAnim is a simple, lightweight jQuery plugin that lets you create custom sprite animations from image sequences like an animated GIF. Licensed under the GPL3.0.

Features:

• Fully customizable.
• Custom trigger element.
• Infinite loop supported.

How to use it:

1. Include jQuery library and the jQuery UixSimpleImagesAnim plugin's script in your page preferably before the end of body tag.

<script src="//code.jquery.com/jquery-1.12.1.min.js"></script>
<script src="js/jquery.UixSimpleImagesAnim.js"></script>

2. Create a container for the plugin.

<div class="sprite1" id="sprite1"></div>

3. Add a sprite image as a background to the container.

.sprite1 {
  background: transparent url(images/sprite.png) 0 0 no-repeat;
  width:65px; 
  height:65px; 
  cursor: pointer;
}

4. Active the sprite animation on mouse hover

$("#sprite1").UixSimpleImagesAnim({
  "imgWidth"     : 65,
  "totalFrame"   :10
});

5. All default configuration options.

$("#container").UixSimpleImagesAnim({
  "animToLastFrameEvent": function () {
    // //code beginning...
  },
  "imgWidth":0,
  "totalFrame":12,
  "speed":50,
  "reverse":false,
  "hoverEffect":false,
  "trigger":"#ho",
  "animLoop":false
});

---

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