Skip to content

Qwerios/spinner-meh-gic

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

6 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Spinner-meh-gic

by Mark Doeswijk
Eagle Eyes Software
http://www.qwerios.nl/

3rd party libs:
---------------
Internet Explorer support works thanks to the magic of excanvas (http://code.google.com/p/explorercanvas/)
Widget factory class courtesy of jQuery UI (http://jqueryui.com/)

Description:
------------
After visiting Full Frontal 2010 (http://2010.full-frontal.org/) I had to get my hands on some of that HTML5 canvas goodness. Every project has an animated gif spinner in there somewhere so I decided to start there.
I've implemented this spinner as a jQuery UI widget factory based widget. So the syntax to create an instance of the widget should be familiar to people who have worked with jQuery UI:

$( ".myElement" ).spinnerMehGic();

That will create a spinner with the default settings. You can customize the settings to your liking and create many different types of spinners. Check out the blog post on my website for some examples of the different styles. (http://www.qwerios.nl/2010/11/20/my-canvas-experiment-spinner-meh-gic/)

After creating the widget you can control the widget with:
$( ".myElement" ).spinnerMehGic( "start" ); 
    or
$( ".myElement" ).spinnerMehGic( "stop"  );

Changing the widget parameters can be done with the setOptions command which takes the same parameters as the widget constructor:
$( ".myElement" ).spinnerMehGic( "setOptions", { partSize: 10, gapSize: 20, spread: 360 } );

Check the wiki on github for the full list of options.

About

Canvas based reusable animated spinner

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published