angular-spinkit ===============
Last updated 5 years ago by urigo .
Original npm · Tarball · package.json
$ cnpm install angular-spinkit 
SYNC missed versions from official npm registry.


SpinKit ( spinners for AngularJS


  1. Install with bower:
bower install angular-spinkit --save
  1. Add angular-spinkit.min.js and angular-spinkit.min.css to your main file (index.html)
<link rel="stylesheet" href="bower_components/angular-spinkit/build/angular-spinkit.min.css">
<script src="bower_components/angular-spinkit/build/angular-spinkit.min.js"></script>
  1. Set angular-spinkit as a dependency in your module
var myapp = angular.module('myapp', ['angular-spinkit'])
  1. Add rotating-plane-spinner, double-bounce-spinner, wave-spinner, wandering-cubes-spinner, pulse-spinner, chasing-dots-spinner or circle-spinner directive to the wanted element, example:
  1. If you want to show the spinner while an image is loading just use the 'spinkit-image-preloader' directive:
<!-- The directive tries to copy dimensions from inline styles and attributes to the spinner placeholder -->
<img width='800' height='600' alt='Your description' ng-src='http://example/img.jpg' spinkit-image-preloader='rotating-plane-spinner' />
<img style='width:800px; height:800px' alt='Your escription' ng-src='http://example/img.jpg' spinkit-image-preloader='rotating-plane-spinner' />

<!-- Also feel free to set width/height and other properties through CSS just configure your own css-class using the 'spinkit-image-preloader-class' attribute (or use css-class by default "spinner-wrapper") -->
<img alt='Your description' ng-src='http://example/img.jpg' spinkit-image-preloader='cube-grid-spinner' spinkit-image-preloader-class='rotating-plane-spinner' />

You can listen to the image loaded event.

// in controller
  1. Add all your requests and ideas in the issues area or send us a pull request!


You can check out this live example here:

Current Tags

  • 0.3.4                                ...           latest (5 years ago)

2 Versions

  • 0.3.4                                ...           5 years ago
  • 0.3.3                                ...           5 years ago
Maintainers (1)
Today 0
This Week 0
This Month 0
Last Day 0
Last Week 0
Last Month 1
Dependencies (0)

Copyright 2014 - 2016 © |