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 摘要 相信大家都见过或使用过放大镜效果,甚至实现过该效果,它一般应用于放大查看商品图片,一些电商网站(例如:凡客,京东商城,阿里巴巴等)都有类似的图片查看效果. 在接下来的博文中,我们将向 ...
随机推荐
- binder对于boolean类型的传递
通过写了一个AIDL文件,查看自动生成的java文件代码得出的结论: 假如有: boolean loadNativeSharedLib(String libPathName); 则对应的binder ...
- 51单片机 | 并行I/O口扩展实例(74LS244/74LS373/4071)
并行I/O口扩展实例 //<51单片机原理及应用(第二版)——基于Keil C与Proteus>第四章例4.4 I/O口不能完全用于输入/输出操作,当需要扩展外部存储器时,P0.P2口用作 ...
- Oracle 修改表名
.ALTER TABLE T_PLAT_KEYWORD_STATISTIC RENAME TO T_PLAT_KEYWORD; .create new_table as select * from o ...
- [腾讯 TMQ] 零基础学习 Fiddler 抓包改包
本文转载于https://testerhome.com/topics/7159 一.Fiddler1.1.简介Fiddler是一款HTTP协议调试代理工具,它能够抓取记录本机所有HTTP(S)请求,通 ...
- java如何实现多个线程并发运行
随着计算机技术的发展,编程模型也越来越复杂多样化.但多线程编程模型是目前计算机系统架构的最终模型.随着CPU主频的不断攀升,X86架构的硬件已经成为瓶,在这种架构的CPU主频最高为4G.事实上目前3. ...
- lvs+keepalived+bind实现负载均衡高可用智能dns
整体架构: 1.IP地址规划: Dns1:172.28.0.54 Dns2:172.28.0.55 Dr服务器主:172.28.0.57 Dr服务器从:172.28.0.67 Vip:172.28.0 ...
- IIS中使用ASP.NET MVC的经验总结
在这篇文章中我们学习在不同版本的IIS中使用ASP.NET MVC和URL Routing.我们学习针对IIS7.0.IIS6.0和更早版本的IIS的处理策略. ASP.NET MVC框架依赖于URL ...
- UVA 10209
10209 - Is This Integration ? #include <stdio.h> #include <math.h> /* */ //多次错误都是因为我将PI定 ...
- 魔幻特效,慢放世界,nova 3带你玩转抖音新技能
无论是明暗相交的都市夜色, 还是鲜亮风景前的逆光美人: 无论是瞬息飘飞的叶片, 还是动如脱兔的稚子孩童…… 色彩与速度,精彩的每一刻, 华为摄影都尽在掌握! (华为手机摄影效果) 一直以来,华为的图形 ...
- k8s集群容器监控
硬件环境: 两台虚拟机, 10.10.20.203 部署docker.etcd.flannel.kube-apiserver.kube-controller-manager.kube-schedule ...