A-A+
jquery fakeLoader.js创建页面加载动画例子
fakeLoader.js 是轻量级的 jQuery 插件,帮助你创建动态的全屏加载掩饰微调效果,模拟页面预加载的效果，下面我们就一起来看一个fakeLoader.js创建页面加载动画例子。
HTML
我们只需要在的第一行加入以下代码。
- <div id="fakeLoader"></div>
CSS
然后在里载入css样式文件。
- <link rel="stylesheet" href="css/fakeLoader.css">
JS
别忘了加载jQuery库文件以及fakeLoader.js。
- <script src="js/jquery.js"></script>
- <script src="js/fakeLoader.min.js"></script>
然后在的上一行加入以下代码：
- <script type="text/javascript">
- $("#fakeloader").fakeLoader();
- </script>
以上代码就是调用了fakeLoader.js插件，该插件还提供了以下选项设置。
timeToHide：过渡加载动画时间，毫秒，默认1200。
spinner:动画效果，有7个值可选:'spinner1', 'spinner2', 'spinner3', 'spinner4', 'spinner5', 'spinner6', 'spinner7'，默认值：spinner1。
bgColor:过渡遮罩层背景色，默认："#2ecc71"。
imagePath:自定义过渡动画图片。