提高用户体验的插件fakeLoader页面加载前loading演示8种效果

 在线预览

下载地址

示例代码

  1. <div id="main">
  2. <div class="demo">
  3. <a href="/api/jq/5733e326a88fd/index.html" class="cur">Spinner1
  4. </a>
  5. <a href="/api/jq/5733e326a88fd/demo2.html">Spinner2
  6. </a>
  7. <a href="/api/jq/5733e326a88fd/demo3.html">Spinner3
  8. </a>
  9. <a href="/api/jq/5733e326a88fd/demo4.html">Spinner4
  10. </a>
  11. <a href="/api/jq/5733e326a88fd/demo5.html">Spinner5
  12. </a>
  13. <a href="/api/jq/5733e326a88fd/demo6.html">Spinner6
  14. </a>
  15. <a href="/api/jq/5733e326a88fd/demo7.html">Spinner7
  16. </a>
  17. <a href="/api/jq/5733e326a88fd/demo8.html">自定义图片
  18. </a>
  19. <div class="result">DEMO1 页面内容已加载完毕。
  20. </div>
  21. </div>
  22. </div>
  23. <script type="text/javascript" src="http://libs.useso.com/js/jquery/1.7.2/jquery.min.js">
  24. </script>
  25. <script src="/api/jq/5733e326a88fd/fakeLoader.min.js">
  26. </script>
  27. <script type="text/javascript">
  28. $(document).ready(function() {
  29. $(".fakeloader").fakeLoader({
  30. timeToHide: 1200,
  31. bgColor: "#2ecc71",
  32. spinner: "spinner1"
  33. }
  34. );
  35. }
  36. );
  37. </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. replicate复制函数

    按指定次数重复字符表达式 REPLICATE ( character_expression, integer_expression) character_expression 字符数据型的字母数字表达 ...

  2. Ubuntu 14.04上安装caffe

    本来实在windows 10上尝试安装caffe,装了一天没装上,放弃; 改在windows上装ubuntu的双系统,装了一个下午,不小心windows的系统盘被锁死了,也不会unlock?只好含泪卸 ...

  3. jxl写入excel实现数据导出功能

    @RequestMapping(params = "method=export", method = RequestMethod.GET) public void exportCo ...

  4. 你用过这种奇葩的C#注释吗?如何看待

    本人虽然不是专业开发人员,也非专业出身,但一直使用C#堆码,解决自己日常的小问题.包括自己的研究,也是用C#来实现和测试.对C#是情有独钟.虽然C#的很多高级技术不会用,也不太懂,但总归是知道,耳闻目 ...

  5. 在office2010怎么样删除图片背景

    在网络上找到一张图片,当你只想要某些部分,但不想要图片的背景的时候,应该怎么办呢,当然你可以借助专业的图片处理工具,如:PS,然后对于大多数没有接触过此软件的同学来说要将背景去掉,实属不易,有没有简单 ...

  6. 配置Hibernate二级缓存时,不能初始化RegionFactory的解决办法

    配置Hibernate 二级缓存时,出现以下bug提示: SLF4J: Failed to load class "org.slf4j.impl.StaticLoggerBinder&quo ...

  7. java并发编程(3):ThreadLocal

    转载:http://www.cnblogs.com/dolphin0520/p/3920407.html 一. 对ThreadLocal的理解 ThreadLocal,很多地方叫做线程本地变量,也有地 ...

  8. 200、301、302、304、404等HTTP状态码

    在网站建设的实际应用中,容易出现很多小小的失误,就像mysql当初优化不到位,影响整体网站的浏览效果一样,其实,网站的常规http状态码的表现也是一样,Google无法验证网站几种解决办法,提及到由于 ...

  9. DES加密解密

    加密后生成Base64字符串,并去除'='字符. 加密后替换掉'+',这样加密后的字符串可以作为url参数传递. using System; using System.IO; using System ...

  10. 基于C#的MongoDB数据库开发应用(2)--MongoDB数据库的C#开发

    在上篇博客<基于C#的MongoDB数据库开发应用(1)--MongoDB数据库的基础知识和使用>里面,我总结了MongoDB数据库的一些基础信息,并在最后面部分简单介绍了数据库C#驱动的 ...