Jquery实现loading效果
需要引入jquery和bootstrap相关包,然后把下面的代码复制进去就可以了:
<div class="modal fade" id="loadingModal" backdrop="static" keyboard="false">
<div style="width: 200px;height:20px; z-index: 20000; position: absolute; text-align: center; left: 50%; top: 50%;margin-left:-100px;margin-top:-10px">
<div class="progress progress-striped active" style="margin-bottom: 0;">
<div class="progress-bar" style="width: 100%;"></div>
</div>
<h5>loading...</h5>
</div>
</div>
<script>
showLoading = function(){
$('#loadingModal').modal({backdrop: 'static', keyboard: false});
}
hideLoading = function(){
$('#loadingModal').modal('hide');
}
</script>
Jquery实现loading效果的更多相关文章
- JQuery+CSS3实现Ajax加载时loading效果
之前通过Ajax请求加载数据的时候,在数据还没有呈现出来前,为了更好的用户体验,总会弄个loading告诉用户其实内容正在加载,而不是网站崩了.但是貌似之前使用gif图片的情况比较多,可能是为了兼容各 ...
- 基于jQuery的图片加载loading效果插件
基于jQuery的图片加载loading效果插件 图片loading的效果是网页中比较常见的,尤其是对大图片,loading效果让用户能够明白图片加载的过程. 实现思路也是比较简单的: $.fn.Lo ...
- 网页Loading效果
问题描述:由于项目要求在页面提交以及加载的时候,有短暂的卡顿,需要用loading过渡. 1.下一个页面加载的时候实现: base-loading.js //获取浏览器页面可见高度和宽度 var _P ...
- HTML5 Canvas 实现的9个 Loading 效果
Sonic.js 是一个很小的 JavaScript 类,用于创建基于 HTML5 画布的加载图像.更强大的是 Sonic.js 还提供了基于现成的例子的创建工具,可以帮助你实现更多自定义的(Load ...
- css3 之炫酷的loading效果
css3 之炫酷的loading效果 今天实现了一个炫酷的loading效果,基本全用css来实现,主要练习一下css3的熟练运用 js需要引入jquery 只用到了一点点js 先看效果图 html: ...
- 页面加载时loading效果
页面加载时loading效果: <!DOCTYPE html> <html lang="en"> <head> <meta charset ...
- 页面loading效果
当网页太大,打开太慢的时候,为了增加良好的用户体验(不让用户眼巴巴的等,心中暗骂c,这么慢),我们需要加一个等待动画. 只需把以下代码加入页面中即可,图片可以根据自己的需求更换,更换图片之后需要改变l ...
- 一个不错的loading效果--IT蓝豹
一个不错的loading效果 介绍:一个不错的loading加载效果,弹性收缩,效果不错,学习android动画的朋友可以下载来研究研究本例子其实由SeekBar实现,由MetaballView,Me ...
- jQuery实现放大镜效果
1.1.1 摘要 相信大家都见过或使用过放大镜效果,甚至实现过该效果,它一般应用于放大查看商品图片,一些电商网站(例如:凡客,京东商城,阿里巴巴等)都有类似的图片查看效果. 在接下来的博文中,我们将向 ...
随机推荐
- 使用PowerDesigner进行代码生成
很多代码生成器都选择了从表结构来生成领域模型,这样的方案有一个前提,就是领域模型和数据库表结构是同构的,也就是说领域模型中的类和数据库中的记录结构十分吻合,这样数据库表结构可以简单的直接映射到领域模型 ...
- Nodejs 模拟telnet
代码下载:https://files.cnblogs.com/files/xiandedanteng/nodejsTelnet.rar 效果: server.js代码: var net=require ...
- 【Excle数据透视表】如何水平并排显示报表筛选区域的字段
原始效果 目标效果 解决方案 设置数据透视表"在报表区域筛选显示字段"为"水平并排" 步骤 方法① 单击数据透视表任意单元格→数据透视表工具→分析→选项→布局和 ...
- maven生成jar包
改了部分cas源码,想重新生成jar包,只好试着脱离eclipse,学了一下maven打jar包的命令,记录如下: 1.首先下载maven (请注意自己的jdk版本,如果使用maven2建议使用jdk ...
- android应用中插入admob广告
Step One 登陆admob,注册用户 直接登陆http://www.admob.com/,用google的账号登陆 Step Two 登陆admob后,在站点和应用程序选项中 选择并添加and ...
- rplidar 扫描角度设置
参考网站:: https://blog.csdn.net/sunyoop/article/details/78302090 https://blog.csdn.net/dzhongjie/arti ...
- Redis的订阅发布
using System; using System.Collections.Generic; using System.Linq; using System.Text; using ServiceS ...
- C#实战Microsoft Messaging Queue(MSMQ)消息队列(干货)<转>
前言 在使用MSMQ之前,我们需要自行安装消息队列组件!(具体安装方法大家自己搜一下吧) 采用MSMQ带来的好处是:由于是异步通信,无论是发送方还是接收方都不用等待对方返回成功消息,就可以执行余下的代 ...
- 【cogs182】【USACO Jan07】均衡队形【st表】
题目描写叙述 农夫约翰的 N (1 ≤ N ≤ 50,000) 头奶牛,每天挤奶时总会按相同的顺序站好. 一日.农夫约翰决定为奶牛们举行一个"终极飞盘"比赛.为简化问题.他将从奶牛 ...
- Linux中openmpi配置
到 http://www.open-mpi.org/ 下载openmpi并解压,事先安装gcc或g++. 我是openmpi-1.6.5,进入解压文件夹,执行 ./configure 这一步执行时间会 ...