如何使用spin.js而不是动画gif

Question

我真的只是在寻找一点指导。我对JQuery非常陌生，所以这一切都有些模糊。

但是，我有一个表单"processing“div，它在表单提交后显示somewhat。

目前，我有一个简单的div动画gif来直观地显示它的发送。

<div id="loading">Please wait, your news is being submitted...
<img src="/-/images/addwalk-loader.gif"/>

​

理想情况下，我希望用通过spin.js创建的微调控件替换动画gif，因为我知道，一旦表单发送，动画gif就不会继续在IE上生成动画。

唯一的问题是，在浏览文档时，我对如何实现它有点不确定。如有任何建议，我们将不胜感激！谢谢!

Answer 1

如果不想像Janus所指出的那样旋转当前对象，则可以创建一个新的微调器对象，然后将其放置在页面上的任意位置。要查看选项列表，只需查看文档！

示例：

var opts = {
   color: '#000'
   //etc etc
};
var spinner = new Spinner(opts).spin();
$("#loading").appendChild(spinner.el);

这里有一个可以解决这个问题的方法：http://jsfiddle.net/vasco/6Ca8Y/

Answer 2

这真的很简单。在应该旋转的JQuery对象上调用.spin()。在你想让它停止的时候调用.spin(false)。

我自己用过的，here。

Answer 3

我发现了另一个插件Activity Indicator，它有更多的自定义选项，并且很容易集成。试一下:|