jmotion – jQuery plugin
JMotion 1.0.2 is a simple jQuery plugin for animating a sequence of images which saved in a folder. The result shows a Gif-like animations or a Banner rotator.
JMotion works with all versions of jQuery from 1.4. to 1.8
Options:
folder // the url path of the folder where images exist type // gif, jpg, png, bmp etc... amount // how many images? pref // if images have prefix such as jm_0, jm_1, jm_2 etc.. fade // fading speed from image to another speed // how long should a single image stays width // width of the image height // height of the image float //if content after image is float: left, right, center effect // try one of the shown effects in demo
Usage:
There are 2 ways of using jmotion:
1. Javascript:
<script language="javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> <script language="javascript" src="jmotion.js"></script> $('#motion').jmotion({ folder:'img', amount:9, width:250, height:250, speed:90, fade:0, float:'left' }); </script> // the container <div id="motion"><img border="0" src="img/preloader.gif" /></div>
2. or pure XHTML by adding jmotion-ex.js in the head part and use class=”jmotion” in your div tag:
<script language="javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> <script language="javascript" src="jmotion.js"></script> <script language="javascript" src="jmotion-ex.js"></script> // the container <div class="jmotion" folder="img" pref="im_" width="200" height="200" speed="90" float="left"></div>
See Demo Download: jmotion.zip