jQuery Plugin To Animate The Grids Of Image - Download jQuery Plugin To Animate The Grids Of An Image - GridImageAnimations

Download jQuery Plugin To Animate The Grids Of An Image – GridImageAnimations

By Posted on

This time I will share jQuery Plugin and tutorial about jQuery Plugin To Animate The Grids Of An Image – GridImageAnimations, hope it will help you in programming stack.

jQuery Plugin To Animate The Grids Of Image - Download jQuery Plugin To Animate The Grids Of An Image - GridImageAnimations
File Size: 708 KB
Views Total: 700
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   

Demo Download

GridImageAnimations is a fancy jQuery plugin that splits a given image to several grids and you can then animate them when needed.

How to use it:

1. Load the jQuery GridImageAnimations plugin after jQuery library and we’re ready to go.

view source
1 <script src="//code.jquery.com/jquery.min.js"></script>
2 <script src="gridImageAnimation.js"></script>

2. Call the main function gridImageAnimation on the target image and specify the animation type (fadeIn or fadeOut) you prefer.

view source
1 $('.myImg').gridImageAnimation({
2   'mode' : 'fadeIn' // or fadeOut
3 });

3. Config the animation with the following options.

view source
01 $('.myImg').gridImageAnimation({
02  
03   // how many cells
04   cell : 15 ,
05  
06   // animation speed
07   speed : 70,
08  
09   // duration
10   durationFading : 200,
11  
12   // null = the original image
13   previewBox : null,
14  
15   // callback function
16   complete : null
17    
18 });

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

source : jqueryscript.net

Related posts: