Minimalist jQuery & CSS3 Rotation Animation Plugin - Rotate.js
| File Size: | 8.77 KB |
|---|---|
| Views Total: | 2016 |
| Last Update: | |
| Publish Date: | |
| Official Website: | Go to website |
| License: | MIT |
Rotate.js is an extremely lightweight jQuery plugin that makes use of CSS3 transforms to rotate any element by a specific number of degrees.
How to use it:
1. Link to jQuery library and the jQuery rotate.js plugin like this:
<script src="//code.jquery.com/jquery.min.js"></script> <script src="dist/js/rotate.js"></script>
2. Load the jQuery easing plugin for more easing effects.
<script src="jquery.easing.js"></script>
3. The JavaScript to rotate an element 360 degrees.
$("#element").rotate(360);
4. Change the default rotation speed.
$("#element").rotate(360, {
duration: 2000
});
5. Apply a custom easing effect.
$("#element").rotate(90, {
easing: 'easeOutBounce'
});
6. Execute a callback function when the rotation animation is completed.
$("#element").rotate(360, {
complete: function () {
// do something
}
});
This awesome jQuery plugin is developed by clarketm. For more Advanced Usages, please check the demo page or visit the official website.











