提高用户体验的插件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种效果的更多相关文章

  1. 页面加载时loading效果

    页面加载时loading效果: <!DOCTYPE html> <html lang="en"> <head> <meta charset ...

  2. 在页面加载前先出现加载loading,页面加载完成之后再显示页面

    在此加入一个关于页面加载成功之前先展现一个loading的案例: 如下代码写入js里放在html头部即可实现需求:添加的可以自己在css文件设置宽高,也可以放入一个background的gif的loa ...

  3. Ionic页面加载前 ionic页面加载完成 ionic页面销毁执行的事件

    ionic 中$ionicView.beforeEnter(页面刚加载前)  $ionicView.afterEnter  (页面加载完成) $destroy(页面销毁) 广播事件 //ionic c ...

  4. vue页面加载前显示{{代码}}的原因及解决办法

    进入正题,简单说说自己对html中出现{{}}的原因及解决办法: 这样写的话,就会出现{{}}一闪的情况: 原因:html的加载顺序: 解析html结构 -> 加载外部脚本和样式表文件 -> ...

  5. 插件-监控页面加载之loading

    查看效果点https://icedjuice.github.io/plug-in/loading/loading.html 简单易用的loading插件,该插件并不是真正的监控页面的资源加载过程,而是 ...

  6. Jquery 在页面加载后执行的几种方式

    1.$(function(){  $("#a").click(function(){  //adding your code here  }); }); 2.$(document) ...

  7. jQuery页面加载初始化常用的三种方法

    当页面打开时我们需要执行一些操作,这个时候如果我们选择使用jquery的话,需要重写他的3中方法,自我感觉没什么区 别,看个人喜好了,第二种感觉比较简单明了: 第一种: 复制代码代码如下: <s ...

  8. 页面加载loading动画

    关于页面加载的loading动画,能度娘到的大部分都是通过定时器+蒙层实现的,虽然表面上实现了动画效果,实际上动化进程和页面加载进程是没有什么关系的,只是设置几秒钟之后关闭蒙层,但假如页面须要加载的元 ...

  9. css3实现loading效果--当页面加载过程中显示Loading的进度条,全部加载完成之后进度条消失

    一个页面等图片资源全部加载完成,会需要很长时间,用户体验会很差,所以我们需要loading来掩盖这个漫长的过程! emmm,定时器?写个定时器还要清除,万一造成内存泄露?定时器之间还会互相影响,呼呼呼 ...

随机推荐

  1. SSIS Send Mail

    在SSIS中Send Mail的方法主要有三种,使用Send Mail Task,使用Script Task和使用存储过程msdb.dbo.sp_send_dbmail. 一,使用Send Mail ...

  2. Geometry Curve of OpenCascade BRep

    Geometry Curve of OpenCascade BRep eryar@163.com 摘要Abstract:几何曲线是参数表示的曲线 ,在边界表示中其数据存在于BRep_TEdge中,BR ...

  3. CSS实现水平垂直同时居中的5种思路

    × 目录 [1]水平对齐+行高 [2]水平+垂直对齐 [3]margin+垂直对齐[4]absolute[5]flex 前面的话 水平居中和垂直居中已经单独介绍过,本文将介绍水平垂直同时居中的5种思路 ...

  4. CSS字体

    字体系列 [1]5种通用字体系列:拥有相似外观的字体系列 serif字体:字体成比例,且有上下短线,包括Times\Georgia\New century Schoolbook sans-serif字 ...

  5. JSP网站开发基础总结《五》

    开始本篇总结之前,首先聊一聊上一篇中存在的一点小问题,上上篇总结数据库创建表时,存在一个问题,name.year.form好像属于关键字,不能做为表的属性,所以大家注意一下,在创建表时保证表的属性不存 ...

  6. Android_TextView之跑马灯效果

    对于android控件中的TextView,相信大家一定不陌生,在显示文本内容时十分方便.不过我在使用时遇到一个小问题,就是当文字交多时,如何为用户进行展示.今天就为大家介绍一种解决方案--跑马灯效果 ...

  7. jsp获得文件的绝对路径

    当前WEB应用的物理路径:<%=application.getRealPath("/")%>当前访问的JSP文件的物理路径:<%=application.getR ...

  8. Packet for query is too large(1767212 > 1048576)mysql在存储图片时提示图片过大

    原网址:http://blog.csdn.net/bigbird2012/article/details/6304417 错误现象:Packet for query is too large(1767 ...

  9. 工作单元模式(UnitOfWork)学习总结

    工作单元的目标是维护变化的对象列表.使用IUnitOfWorkRepository负责对象的持久化,使用IUnitOfWork收集变化的对象,并将变化的对象放到各自的增删改列表中, 最后Commit, ...

  10. MySQL的学习--用户创建授权

    前一段时间,将项目改成SAAS的架构,每个billing account都可以获得一个子域,一个单独的数据库,一个单独的数据库用户和对应数据库的权限. 现在有时间了,将数据库相关的命令用博客备份一下. ...