前些天做项目的时候,在下载报表部分,大家说下载等待时间太久了,没有给用户一个提示,不是很好。就让我写个JavaScript做一个弹出提示,等下载完了,再取消这个弹出提示。拿到这个任务的时候我想到了JavaEye登陆界面我就试着模仿这个效果做出了个JavaScript(JAVAEYE弹出登陆使用的不是JAVASCRIPT),现在把代码贴出来,希望,高手不要见笑
原理就是创建两个动态的DIV,一个当背景设置为透明,一个则加载显示页面
--------------------------------------------------------加载页面------------------------------------------------------------------------
js 代码
- function loading(){
-
- var loadPage ;
- var dynDivBg = document.createElement("div");
- dynDivBg.style.backgroundColor= "#C0C0C0";
- dynDivBg.style.position = "absolute";
- dynDivBg.style.filter = "progid:DXImageTransform.Microsoft.Alpha(opacity=50)";
- dynDivBg.style.width = "100%";
- dynDivBg.style.height = "100%";
- dynDivBg.id = "dynDivBg";
-
- var dynDiv = document.createElement("div");
- dynDiv.style.position = "absolute";
- dynDiv.style.backgroundColor = "red";
- dynDiv.style.borderWidth = "2px";
- dynDiv.style.borderStyle ="solid";
- dynDiv.style.borderColor ="green";
- dynDiv.style.left = "200px";
- dynDiv.style.top = "250px";
- dynDiv.id = "dynDiv";
- dynDiv.innerText = "数据加载中……";
- document.body.insertAdjacentElement("afterBegin",dynDiv);
- document.body.insertAdjacentElement("afterBegin",dynDivBg);
- }
--------------------------------------------------------加载显示页面-------------------------------------------------------------
js 代码
- function login_suc(){
-
- window.parent.document.body.removeChild(window.parent.document.getElementById("dynDivBg"));
- window.parent.document.body.removeChild(window.parent.document.getElementById("dynDiv"));
-
-
- }
分享到:
相关推荐
最牛Javascript 日历控件 很棒! 两步骤完全搞定 1.引用 <script language="javascript" type="text/javascript" src="My97DatePicker/WdatePicker.js"> 2.使用 onClick="WdatePicker()
JavaScript犀牛书 大小19mb 压缩格式7z
犀牛JavaScript第5版,学习JavaScript不可多得的精品资料。
js的骨灰级学习资料,适合初学者入门使用,涵盖内容丰富。
犀牛JavaScript(第5版) JavaScript概述 语法结构 数据类型和值 变量 表达式和运算符 语句 对象和数组 函数 构造函数和原型 模块和名字空间 使用正则表达式的模式匹配 脚本化java 客户端 JavaScript
JavaScript权威指南,最著名的javaScript参考用书。被大家亲切的成为犀牛书,是O'Reilly出版集团动物系列书的一分子。
JAVASCRIPT牛X效果JAVASCRIPT牛X效果JAVASCRIPT牛X效果
从前听李大拿说过这个是用JavaScript技术实现的小游戏,当找到这个东西并且翻看了里面的源代码之后,对JavaScript的认识更深入了一层,原来JS可以这么牛?!
右键点击chm文档,查看属性,可以看到“安全”提示:此文件来自于其它计算机,可能被阻止以帮助保护该计算机,提示后面有一个“解除锁定”的按钮。选择解除,然后保存修改。 JavaScript权威指南,著名的犀牛书:)...
资源名称:Javascript权威指南(第五版)内容简介:《Javascript权威指南第4版》中文版出版至今已有三年多的时间。这本《JaVascript权威指南》连续印刷5次,销售数十万册,成为很多Javascript...
javascript[超牛]带阴影的可拖动的浮动层,由http://www.che2.com/提供
自1996年以来,JavaScript的:权威指南已为JavaScript圣经程序员,程序员指南和全面的参考,以核心语言和客户端JavaScript API的Web浏览器定义。第6版包括HTML5和ECMAScript 5,与jQuery和服务器端JavaScript新的...
超强的javascript html5 下的游戏 得在支持Html5的浏览器下运行
犀牛JavaScript第5版,学习JavaScript不可多得的精品资料。
见过最牛 最强大的javascript 教程!!
很多章节完全重写,以便与时俱进,紧跟当今的Web开发实践。本书新增章节描述了jQuery和服务器端JavaScript。 本书适合那些希望学习Web编程语言的初、中级程序员和希望精通JavaScript的程序员阅读。
JavaScript高级
淘宝前端团队倾情翻译!经典权威的JavaScript犀牛书!第6版特别涵盖了HTML5和ECMAScript5!
七牛 JavaScript SDK 支持一下浏览器平台 IE 5.5-8 (Adobe Flash is required) IE 8-11 Chrome Safari FireFox Opera Webkit 系平台 示例代码: qiniu.on('file', function(file) { // Image ...