Spin.js uses the CSS3 to render the UI, falling back to VML Internet Explorer. If supported by the browser, @keyframe rules are used to animate the spinner. The spin() method creates the necessary HTML elements and starts the animation. If a target element is passed as argument, the spinner is added as first child and horizontally and vertically centered.
Spin.js also supports jQuery, Anyway, if you use jQuery (or zepto.js) you may use the following plugin
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
$.fn.spin = function(opts) { this.each(function() { var $this = $(this), spinner = $this.data('spinner'); if (spinner) spinner.stop(); if (opts !== false) { opts = $.extend({color: $this.css('color')}, opts); spinner = new Spinner(opts).spin(this); $this.data('spinner', spinner); } }); return this; }; |
Requirement : – Jquery (not necessary) , spin.js
Demo :- http://fgnass.github.com/spin.js/
License:- MIT License