可以使用bootstrap的模态框(modal.js),使用它我们可以做出loading效果。

html

<!-- loading -->
<div class="modal fade" id="loading" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" data-backdrop='static'>
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title" id="myModalLabel">提示</h4>
</div>
<div class="modal-body">
请稍候。。。<span id="result"></span>
</div>
</div>
</div>
</div>

js

//显示
$('#loading').modal('show');
//影藏
$('#loading').modal('hide');

bootstrap-实现loading效果的更多相关文章

  1. 页面loading效果

    当网页太大,打开太慢的时候,为了增加良好的用户体验(不让用户眼巴巴的等,心中暗骂c,这么慢),我们需要加一个等待动画. 只需把以下代码加入页面中即可,图片可以根据自己的需求更换,更换图片之后需要改变l ...

  2. 网页Loading效果

    问题描述:由于项目要求在页面提交以及加载的时候,有短暂的卡顿,需要用loading过渡. 1.下一个页面加载的时候实现: base-loading.js //获取浏览器页面可见高度和宽度 var _P ...

  3. 一个不错的loading效果--IT蓝豹

    一个不错的loading效果 介绍:一个不错的loading加载效果,弹性收缩,效果不错,学习android动画的朋友可以下载来研究研究本例子其实由SeekBar实现,由MetaballView,Me ...

  4. 【转】 CSS3实现10种Loading效果

    昨晚用CSS3实现了几种常见的Loading效果,虽然很简单,但还是分享一下,顺便也当是做做笔记…… PS:如需转载,请注明出处! 第1种效果: 代码如下: <div class="l ...

  5. jQuery8种不同的瀑布流懒加载loading效果

    优化图片加载插件jQuery8种不同的瀑布流懒加载loading效果  在线预览 下载地址 实例代码 <ul class="grid effect-1" id="g ...

  6. HTML5 Canvas 实现的9个 Loading 效果

    Sonic.js 是一个很小的 JavaScript 类,用于创建基于 HTML5 画布的加载图像.更强大的是 Sonic.js 还提供了基于现成的例子的创建工具,可以帮助你实现更多自定义的(Load ...

  7. 加载状态为complete时移除loading效果

    一.JS代码: //获取浏览器页面可见高度和宽度 var _PageHeight = document.documentElement.clientHeight, _PageWidth = docum ...

  8. CSS3轻松实现清新 Loading 效果

    至今HTML5中国已经为大家分享过几百种基于 CSS3 的Loading加载动画,效果酷炫代码简洁,非常值得学习借鉴;今天就先给大家分享两个常用的CSS3的Loading的案例. 第一种效果: HTM ...

  9. 一个很酷的加载loading效果--IT蓝豹

    一个很酷的加载loading效果,自定义LeafLoadingView实现,LeafLoadingView继承view, 本例子主要由以下几点构成 (1):RotateAnimation实现叶子旋转 ...

随机推荐

  1. 使用ycsb对hbase1.4.9 benchmark

    Ycsb下载地址:https://github.com/brianfrankcooper/YCSB/releases 目前测试hbase1.4.9,因此下载ycsb-hbase14-binding-0 ...

  2. ELK使用1-Elasticsearch使用

    一.es 1.通过curl命令获取es进群信息 a.curl -i(设置协议的头信息) -XGET 'http:192.168.30.41:9200/_count' b.查看集群状态 curl -XG ...

  3. spring cloud (二、服务注册安全demo_eureka)

    spring cloud (一.服务注册demo_eureka) 加强服务的安全性,我们接下来加上访问的账号密码: 首先需要添加对应的依赖 <!--账号密码认证依赖--> <depe ...

  4. spring mvc中的service和controller中读取不到properties值

    根据web.xml读取配置文件中的顺序来看 controller层和service层来自于spring mvc.xml中读取,所以必须要在spring mvc.xml中配置读取资源文件夹方式

  5. Hdu-1098解题报告

    Hdu-1098解题报告 题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1098 题意:已知存在一个等式f(x)=5*x^13+13*x^5+k*a*x ...

  6. 003.Ansible基础使用

    一 Ansible命令用法 Ansible命令行执行方式有:Ad-Hoc.Ansible-playbook两种,Web方式其官方提供付费产品Tower.Ad-Hoc主要用于临时命令的执行,Ansibl ...

  7. Jenkins环境搭建(5)-与Jmeter完成参数化构建和构建前删除操作

    此前介绍过几篇关于Jenkins配置相关的文章,今天再来说说参数化构建和构建前删除已有的报告.在实际测试过程中,是需要测试几套环境的,不使用参数化构建的话,构建脚本就比较麻烦了:自然,已生成的报告,不 ...

  8. asp.net core 依赖注入实现全过程粗略剖析(2)

    接着 上篇 目前也算是交代清楚了相关的类.那么框架具体是如何来实例化的呢?整个的流程是怎么样的. 我们参考源码中的Test文件夹来看看: var collection = new ServiceCol ...

  9. SpringBoot返回json和xml

    有些情况接口需要返回的是xml数据,在springboot中并不需要每次都转换一下数据格式,只需做一些微调整即可. 新建一个springboot项目,加入依赖jackson-dataformat-xm ...

  10. opencv3 学习笔记(一)

    1.cv2.imread(path,cv2.IMREAD_ANYCOLOR) IMREAD_ANYCOLOR=4(全彩模式)/IMREAD_GRAYSCALE=0(灰度模式)2.cv2.imwrite ...