原文地址:http://www.cnblogs.com/lxblog/p/3425599.html

我们在做Ajax 异步请求的时候,一般都会利用一个动态的 Gif 小图片来制作一个Ajax Loading ,以便增加用户体验。

今天在网上发现了一个 Spin.js ,该 js 脚本压缩后5k,可以不用任何图片,任何外部的CSS样式,就可以创建一个Ajax Loading 指示器,且兼容以下浏览器:

Spin.js 的在线设计、演示及下载地址为http://fgnass.github.io/spin.js/

我们可以在链接页面中,动态设置样式同时会自动生成样式的配置脚本:

Spin.js 用法极其的简单:

显示 spinner

//target为显示spiner的父容器
var target=document.getElementById("id")
spinner.spin(target);

隐藏 spinner
 spinner.spin();

为大家分享一个 Ajax Loading —— spin.js(转)的更多相关文章

  1. 为大家分享一个 Ajax Loading —— spin.js

    我们在做Ajax 异步请求的时候,一般都会利用一个动态的 Gif 小图片来制作一个Ajax Loading ,以便增加用户体验. 今天在网上发现了一个 Spin.js ,该 js 脚本压缩后5k,可以 ...

  2. Loading——spin.js

    官网:[http://spin.js.org/] Github地址:[https://github.com/fgnass/spin.js]

  3. 分享一个延迟加载图片的JS

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...

  4. 分享一个tom大叔的js 深入理解系列 (有助于提升)

    http://www.cnblogs.com/TomXu/archive/2011/12/15/2288411.html#3620172

  5. 使用spin.js优化等待ajax返回时的页面效果

    [本文出自天外归云的博客园] 最近在做一个JIRA信息统计的系统,在统计JIRA关联信息的过程中由于需要等待ajax返回结果到前端,时间较长,所以要添加一段等待时的loading画面,使用spin.j ...

  6. 福利到~分享一个基于jquery的智能提示控件intellSeach.js

    一.需求 我们经常会遇到[站内搜索]的需求,为了提高用户体验,我们希望能做到像百度那样的即时智能提示.例如:某公司人事管理系统,想搜索李XX,只要输入“李”,系统自然会提示一些姓李的员工,这样方便用户 ...

  7. spin.js无图片实现loading进度条,支持但非依赖jquery

    特点: 1.无图片,无外部CSS 2.无依赖(支持jQuery,但非必须) 3.高度可配置 4.分辨率无关 5.旧版本IE不支持时,采用VML支持 6.使用关键帧动画,采用setTimeout() 7 ...

  8. 分享一个手机端好用的jquery ajax分页类

    分享一个手机端好用的jquery ajax分页类 jquery-ias.min.js 1,引入jquery-ias.min.js 2,调用ajax分页 <script type="te ...

  9. 分享一个快速设置背景的js 自动获取背景图的长宽

    我来分享一个快速设置背景的js (需要jq支持!) 快速切图铺页面用---就是不需要手动输入背景图的长宽 自动获取背景图的长宽 : <div class="wrap"> ...

随机推荐

  1. 取消mod_sofia的呼叫鉴权

    FreeSWITCH中默认的SIP呼叫是要鉴权的,流程如下. 终端 FreeSWITCH A -----Invite------> FS A <----Trying------ FS A ...

  2. Freebie - Utility Form: Generate Excel Report From SQL Query In Oracle Forms 6i And 11g

    Sharing a form to generate Excel file report from SQL query in Oracle Forms. This form can be used i ...

  3. 常用CMD命令

    查看电脑最大支持多大的内存:    wmic memphysical get maxcapacity   查询DNS:    nslookup a.root-servers.net   路由线路:  ...

  4. 问题处理:找不到Pch预编译文件?

    提醒:Xcode6之后就不再自动创建Pch预编译文件 在Xcode6之前,创建一个新工程xcode会在Supporting files文件夹下面自动创建一个“工程名-Prefix.pch”文件,也是一 ...

  5. OnClientClick的用法

    摘自:http://blog.csdn.net/coolpig86/article/details/5439560 OnClientClick用于执行客户端脚本.当我们单击一个按钮时,最先执行的是On ...

  6. HUD5423 Rikka with Tree(DFS)

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=5423 Rikka with Tree Time Limit: 2000/1000 MS (Java/O ...

  7. alloc && afree

    #define ALLOCSIZE 10000 static char allocbuf[ALLOCSIZE]; static char *allocp = allocbuf; char *alloc ...

  8. eclispse 中集成多个tomcat

    1.背景 在本地需要运行两个项目进行测试时,需要同时启动两个服务器,所以集成多个Tomcat到eclipse就成为一个必要的知识点. 2.准备知识 2.1 因为同时在一台主机上运行,所以多个服务器共用 ...

  9. Codeforces 731F Video Cards

    题意:给定n个数字,你可以从中选出一个数A(不能对该数进行修改操作),并对其它数减小至该数的倍数,统计总和.问总和最大是多少? 题解:排序后枚举每个数作为选出的数A,再枚举其他数, sum += a[ ...

  10. 初试Celery

    从@到celery 一.文档: 官网:http://www.celeryproject.org/ Celery3.1 ------------2016-7-19 18:26:55-- source:[ ...