spin.js

[uniquejava]

how

bower install --save spin.js

new Spinner(opts).spin(target), 需要将target的position设置为relative，因为spin会将spinner div插入到target并做为target的第一个child. 为使spinner在target中保持居中. 它给该div设置了如下的样式：

    position: absolute;
    width: 0px;
    z-index: 2000000000;
    left: 50%;
    top: 50%;

结合requirejs的用法如下：

require.config({
    baseUrl: 'js/lib/',
    paths: {
        jquery: 'jquery-2.1.4',
        underscore: 'underscore/underscore',
        backbone: 'backbone/backbone',
        mustache: 'mustache-2.2.0',
        templates: '../templates',
        router: '../router',
        text: 'requirejs-text-2.0.14',
        json: 'requirejs-json-0.4.0',
        jquerySidr: 'jquery.sidr',
        markdownConverter: 'Markdown.Converter',
        hbs: "hbs/hbs",
        handlebars: "handlebars/handlebars.runtime",
        utils: "../utils",
        spin: 'spin.js/spin'
    },
...

define(['jquery', 'spin'], function ($, Spinner) {
  function showBusy(){
    this.spinner = new Spinner({lines: 10});
    this.spinner.spin($('#content').get(0));
  }
  function hideBusy(){
    this.spinner.stop();
  }
});