可以使用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. BZOJ2084 [Poi2010]Antisymmetry Manachar

    题目传送门 - BZOJ2084 题解 对于一个0我们把它看作01,1看作10,然后只要原串中的某个子串可以通过这两个变换成为回文串就可以满足条件了. 对于转换过的串,Manachar随便弄几下就可以 ...

  2. sql 表值函数-将一个传入的字符串用2中分隔符拆分成临时表

    USE [tms]GO/****** Object: UserDefinedFunction [dbo].[fn_StrToTable_Double] Script Date: 2017/4/26 9 ...

  3. apache利用http_referer进行防盗链

    http://blog.sina.com.cn/s/blog_8729dd9801011rn1.html

  4. NSL:CPK_NN神经网络实现预测哪个样本与哪个样本处在同一层,从而科学规避我国煤矿突水灾难—Jason niu

    load water_data.mat attributes = mapminmax(attributes); P_train = attributes(:,1:35); T_train = clas ...

  5. CSS-变量

    为什么使用 css variables 借用Scrimba上的: easier to get started (no transpiling) have access to the DOM 1.loc ...

  6. redis+mysql

    redis和mysql要根据具体业务场景去选型 mysql:数据放在磁盘   redis:数据放在内存 redis适合放一些频繁使用,比较热的数据,因为是放在内存中,读写速度都非常快,一般会应用在下面 ...

  7. jmeter正则表达式提取器提取特定字符串后的全部内容

    jmeter进行JDBC请求时,请求后的响应结果在传递给下一个请求使用时,需要用到关联,也在jmeter中,关联通过正则表达式提取器实现. 但是,在JDBC请求后的响应结果中,往往需要关联的内容是只有 ...

  8. webstorm过期最新激活方法

    打开webstorm 注册时,在打开的License Activation窗口中选择“License server”,在输入框输入下面的网址:http://idea.iteblog.com/key.p ...

  9. excel 删除重复项

    excel 删除重复项 单击“数据”按钮会出现如图所示,这时我们可以看到,在下分的菜单栏里有一个“删除重复项”选项,单击该选项.

  10. BZOJ.3170.[TJOI2013]松鼠聚会(切比雪夫距离转曼哈顿距离)

    题目链接 将原坐标系每个点的坐标\((x,y)\)变为\((x+y,x-y)\),则原坐标系中的曼哈顿距离等于新坐标系中的切比雪夫距离. 反过来,将原坐标系每个点的坐标\((x,y)\)变为\((\f ...