spin.js的使用

spin.js这个小东西搞了好久才明白该怎么使用，官方文档实在太简单，不考虑我等小白啊~~

例如你有一个js的function，来和后台交互产生数据显示，但需要一定时间，而这段时间不适用loading就会给用户感觉假死。。

那么，spin.js很适合这种场景。

function aaa(a, b, c) {var opts = {    lines: 12, // 菊花瓣的数目    length: 7, // 菊花瓣的长度    width: 4, // 菊花瓣的宽度    radius: 10, // 菊花中心的半径    corners: 1, // 菊花瓣的圆滑度(0--1)    rotate: 0, // 让菊花旋转的角度    color: '#000', // 菊花的颜色    speed: 1.6, // 菊花旋转的速度    trail: 58, // 菊花旋转时的余辉    shadow: false, // 是否需要菊花的阴影    hwaccel: false, // 是否需要菊花高速旋转(硬件加速)    className: 'spinner', // 菊花的classname    zIndex: 2e9, // 菊花的z-index值    top: 'auto', // 菊花相对定位的top    left: 'auto', // 菊花相对定位的left    position: 'relative'};  var target = document.getElementById('bb');  //top和left使用auto，使得菊花定位于bb的正中心var spinner = new Spinner(opts).spin(target);  $.post(("bbb"), {beginDate : a,pm : b,jc : c}, function(data, status) {if (data != "Null") {$("#myPage").empty();$("#bmore").remove();$("#myPage").append(data);$('#myPage').collapsibleset('refresh');spinner.stop();$("#myPage ul").each(function(i) {$(this).listview();});} else {alert("无数据");}});}

其中菊花的位置看代码说auto是在正中心，但实际总是在（0,0）点，后来才发现因为页面是动态生成，所以菊花显示的时候<div></div>中还没有内容，所以才在边缘，后来将菊花放到上一层就好了。