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,定时器?写个定时器还要清除,万一造成内存泄露?定时器之间还会互相影响,呼呼呼 ...
随机推荐
- 如何用sublime 编写sass
使用了Sublime Text也有一段时日了,然后在现在而言,小觉的coding工具已经非其莫属了,接着小觉因为近期忙着项目的原因,同时还要抽空编辑博客的原因,就暂时把它放在一旁了,现在偶然想起也就说 ...
- Object.create
var emptyObject = Object.create(null); var emptyObject = Object.create(null); var emptyObject = {}; ...
- Spark MLlib - Decision Tree源码分析
http://spark.apache.org/docs/latest/mllib-decision-tree.html 以决策树作为开始,因为简单,而且也比较容易用到,当前的boosting或ran ...
- 如何线程安全地遍历List:Vector、CopyOnWriteArrayList
遍历List的多种方式 在讲如何线程安全地遍历List之前,先看看通常我们遍历一个List会采用哪些方式. 方式一: for(int i = 0; i < list.size(); i++) { ...
- python类定义与c#的一些区别
c#中可以定义一个空类,但是python中定义空类需要加pass class EmptyClass(object): pass python的lei是多继承 python子类继承了基类,如果子类也 ...
- IP,路由,交换基础培训记录
IP 掩码 子网划分 vlan划分(有助于减少广播压力) vlan之间互通通过交换机打通. 路由,静态路由,动态路由(学习到的),路由表,下一跳,网络位长的优先级高. 交换机,hub集线器. hub ...
- Python编码问题整理
认识常见编码 GB2312是中国规定的汉字编码,也可以说是简体中文的字符集编码 GBK 是 GB2312的扩展 ,除了兼容GB2312外,它还能显示繁体中文,还有日文的假名 cp936:中文本地系统是 ...
- sublime 插件总结
sublime的强大之处在于其丰富的插件,记录一下常用的插件. 1.Color Highlighter(识别代码中的颜色) 默认如下显示 做如下修改,打开插件默认设置,并复制到用户设置,将 " ...
- SQL Server安全(5/11):架构与安全(Schemas and Security)
在保密你的服务器和数据,防备当前复杂的攻击,SQL Server有你需要的一切.但在你能有效使用这些安全功能前,你需要理解你面对的威胁和一些基本的安全概念.这篇文章提供了基础,因此你可以对SQL Se ...
- Java魔法堂:JVM的运行模式
一.前言 JVM有Client和Server两种运行模式.不同的模式对应不同的应用场景,而JVM也会有相应的优化.本文将记录JVM模式的信息,以便日后查阅. 二.介绍 在$JAVA_HOME/jre/ ...