ajax遮盖
2015-08-18 15:42
351 查看
1.HTML中div遮盖
2.对应的CSS样式
3.js中调用方法
<!-- 加载信息--> <div class="framework-loading"> <div class="framework-loading-div"> <div class="framework-loading-label"> 数据加载中,请耐心等待... </div> </div> </div> <div class="framework-masker"></div><!--此处为遮盖-->
2.对应的CSS样式
.framework-loading{ position: absolute; z-index: 1201; background: url(//initLoading.gif//此处为加载图片) repeat-x; border:#6593CF 1px solid; height:30px; top:50%; left:50%; margin-top:-16px; margin-left:-94px; } .framework-loading-div{ font-size: 14px; margin:2px; color: #1F1F1F; height: 24px; padding-left:12px; border: #A3BAD9 1px solid; background: white url(///loading.gif//此处为加载图片) no-repeat 2px 4px; } .framework-loading-label{ margin: 4px 7px 1px 8px; text-align:center; width:240px; font-size: 14px; } .framework-masker{ position: absolute; z-index: 1200; background-color: #ccc; filter:progid:DXImageTransform.Microsoft.alpha(opacity=50); opacity: .3; width:100%; height:100%; }
3.js中调用方法
$(function () { //Ajax加载提示 $(document).ajaxStart(function(){ $(".framework-loading").show(); $(".framework-masker").show(); }); $(document).ajaxStop(function(){ $(".framework-loading").hide(); $(".framework-masker").hide(); }); });
相关文章推荐
- Android动画效果animation
- TCP/IP协议学习(二) LWIP用户自定义配置文件解析
- [LeetCode] Longest Substring Without Repeating Characters
- PHP版3DES加解密类
- springboot 开发入门,及问题汇总
- UIAlertView的基本用法
- 数学D - Box of Bricks
- Thinkphp常用配置文件
- Codeforces 570A__Elections
- 树结构练习——判断给定森林中有多少棵树
- 位操作总结
- javascript知识回顾
- 厦门大学线下编程比赛第一题:求和
- Android JIN返回结构体
- 编程作业—C++初探 简单的学生信息处理程序实现
- DateUtil
- UVA 11600-Masud Rana(状压,概率dp)
- dell 720 raid 配置
- 浅析信息系统架构的应用架构与数据架构
- Hibernate映射关系配置