fakeLoader页面加载前loading演示8种效果
提高用户体验的插件fakeLoader页面加载前loading演示8种效果
在线预览
示例代码
<div id="main">
<div class="demo">
<a href="/api/jq/5733e326a88fd/index.html" class="cur">Spinner1
</a>
<a href="/api/jq/5733e326a88fd/demo2.html">Spinner2
</a>
<a href="/api/jq/5733e326a88fd/demo3.html">Spinner3
</a>
<a href="/api/jq/5733e326a88fd/demo4.html">Spinner4
</a>
<a href="/api/jq/5733e326a88fd/demo5.html">Spinner5
</a>
<a href="/api/jq/5733e326a88fd/demo6.html">Spinner6
</a>
<a href="/api/jq/5733e326a88fd/demo7.html">Spinner7
</a>
<a href="/api/jq/5733e326a88fd/demo8.html">自定义图片
</a>
<div class="result">DEMO1 页面内容已加载完毕。
</div>
</div>
</div>
<script type="text/javascript" src="http://libs.useso.com/js/jquery/1.7.2/jquery.min.js">
</script>
<script src="/api/jq/5733e326a88fd/fakeLoader.min.js">
</script>
<script type="text/javascript">
$(document).ready(function() {
$(".fakeloader").fakeLoader({
timeToHide: 1200,
bgColor: "#2ecc71",
spinner: "spinner1"
}
);
}
);
</script>
fakeLoader页面加载前loading演示8种效果的更多相关文章
- 页面加载时loading效果
页面加载时loading效果: <!DOCTYPE html> <html lang="en"> <head> <meta charset ...
- 在页面加载前先出现加载loading,页面加载完成之后再显示页面
在此加入一个关于页面加载成功之前先展现一个loading的案例: 如下代码写入js里放在html头部即可实现需求:添加的可以自己在css文件设置宽高,也可以放入一个background的gif的loa ...
- Ionic页面加载前 ionic页面加载完成 ionic页面销毁执行的事件
ionic 中$ionicView.beforeEnter(页面刚加载前) $ionicView.afterEnter (页面加载完成) $destroy(页面销毁) 广播事件 //ionic c ...
- vue页面加载前显示{{代码}}的原因及解决办法
进入正题,简单说说自己对html中出现{{}}的原因及解决办法: 这样写的话,就会出现{{}}一闪的情况: 原因:html的加载顺序: 解析html结构 -> 加载外部脚本和样式表文件 -> ...
- 插件-监控页面加载之loading
查看效果点https://icedjuice.github.io/plug-in/loading/loading.html 简单易用的loading插件,该插件并不是真正的监控页面的资源加载过程,而是 ...
- Jquery 在页面加载后执行的几种方式
1.$(function(){ $("#a").click(function(){ //adding your code here }); }); 2.$(document) ...
- jQuery页面加载初始化常用的三种方法
当页面打开时我们需要执行一些操作,这个时候如果我们选择使用jquery的话,需要重写他的3中方法,自我感觉没什么区 别,看个人喜好了,第二种感觉比较简单明了: 第一种: 复制代码代码如下: <s ...
- 页面加载loading动画
关于页面加载的loading动画,能度娘到的大部分都是通过定时器+蒙层实现的,虽然表面上实现了动画效果,实际上动化进程和页面加载进程是没有什么关系的,只是设置几秒钟之后关闭蒙层,但假如页面须要加载的元 ...
- css3实现loading效果--当页面加载过程中显示Loading的进度条,全部加载完成之后进度条消失
一个页面等图片资源全部加载完成,会需要很长时间,用户体验会很差,所以我们需要loading来掩盖这个漫长的过程! emmm,定时器?写个定时器还要清除,万一造成内存泄露?定时器之间还会互相影响,呼呼呼 ...
随机推荐
- 面试小记---外部脚本必须包含 <script> 标签吗?
外部脚本必须包含 <script> 标签吗? 答案是否定的. 身为小白的我一开始也是以为这句话的对了,因为本来嘛,引用外部脚本不都用的是<script>标签中的src属性吗.所 ...
- 如果正确读取SQL Server中的扩展事件?
SQL Server中使用扩展事件捕捉所需的信息后,可以选择存放的位置.比如说内存或文件中,但无论存在哪里,其本质都是一个大XML.因此在SQL Server中读取该XML就是解析扩展事件结果 ...
- 初始化的一些问题(Vector使用)
import java.util.Vector; import java.util.Iterator; import java.util.Arrays; import java.util.ArrayL ...
- java中Object.equals()简单用法
/* equals()方法默认的比较两个对象的引用! */ class Child { int num; public Child(int x){ num = x; } //人文的抛出运行时异常的好处 ...
- Java多线程系列--“JUC原子类”03之 AtomicLongArray原子类
概要 AtomicIntegerArray, AtomicLongArray, AtomicReferenceArray这3个数组类型的原子类的原理和用法相似.本章以AtomicLongArray对数 ...
- Flume官方文档翻译——Flume 1.7.0 User Guide (unreleased version)(一)
Flume 1.7.0 User Guide Introduction(简介) Overview(综述) System Requirements(系统需求) Architecture(架构) Data ...
- Unity3D重要知识点
数据结构和算法很重要!图形学也很重要!大的游戏公司很看重个人基础,综合能力小公司看你实际工作能力,看你的Demo. 1.什么是渲染管道? 是指在显示器上为了显示出图像而经过的一系列必要操作. 渲染管道 ...
- Python语言特性之3:@staticmethod和@classmethod
问题:Python中@staticmethod和@classmethod两种装饰器装饰的函数有什么不同? 原地址:http://stackoverflow.com/questions/136097/w ...
- 图论 --- spfa + 链式向前星 : 判断是否存在正权回路 poj 1860 : Currency Exchange
Currency Exchange Time Limit: 1000MS Memory Limit: 30000K Total Submissions: 19881 Accepted: 711 ...
- C语言学习003:Hello 指针
在C中使用指针的原因 避免副本 在函数调用的时候,可以只传递数据的引用,而不用传递数据 数据共享 两段代码可以同时操作同一份数据,而不是两份独立的副本 使用指针读写数据 #include <st ...