Question

如何载入jquery库文件和动画背景插件

Answer 1

shCircleLoader是一个非常棒的jQuery加载动画插件,它可轻松的集成到web应用中,帮助web开发人员快速创建各种加载动画。
特点：
多种动画参数选择
通常不需要包括CSS文件,但是你可以从脚本关闭CSS样式，进行自定义。
CSS“名称空间”允许您创建不同的加载动画在同一页
自定义CSS关键帧animtion声明
加载进程在画动中央显示
需求：
shCircleLoader 只有jquery 1.10.3 和 2.0.3上测试过，不过其它版本应该也可以使用。
需要现代浏览器的CSS3的动画支持，在Opera上有点小问题
使用方法
在head区引入核心文件
<script src="http://code.jquery.com/jquery-2.0.3.min.js" type="text/javascript"></script>
<script src="/your/path/to/jquery.shCircleLoader-min.js" type="text/javascript"></script>

创建一个动画,首先你必须把< div >标记添加到你需要显示的位置，并加上适当的宽度和高度。
<div id="loader" style="width: 100px; height: 100px"></div>

当动画播放时,使用shCircleLoader()函数创建一个div标记
$('#loader').shCircleLoader();

在动播正在播放时，可以显示一个加载进程在中心
$('#loader').shCircleLoader('progress', "50%");

第二个参数是你想要显示的字符串。您可以使用一个变量来代替。
动画已经停止时,你应该摧毁动画。
$('#loader').shCircleLoader('destroy');

选项
clockwise ：Boolean型，定义动画的旋转方向
color：String型，点的颜色。如果使用“自动”项，颜色将从容器div的CSS属性中获取
dots：Integer型，点的数量
dotsRadius：Integer型，点的圆角。如果选择“自动”,该脚本将计算半径,所以点就不能被重叠。
duration：Float型，动画一个循环的持续时间，以秒为单位
externalCss：Boolean型，设为ture时，动画元素不接受任何CSS样式
keyframes：String型，定义点的动画
namespace：String型，CSS的命名空间
radius：Integer型，容器DIV的圆角
uaPrefixes：Array型，浏览器特定CSS前缀