`
mgssnake
  • 浏览: 41896 次
  • 性别: Icon_minigender_1
  • 来自: 武汉
文章分类
社区版块
存档分类
最新评论

JavaScript你有多牛!

阅读更多

     前些天做项目的时候,在下载报表部分,大家说下载等待时间太久了,没有给用户一个提示,不是很好。就让我写个JavaScript做一个弹出提示,等下载完了,再取消这个弹出提示。拿到这个任务的时候我想到了JavaEye登陆界面我就试着模仿这个效果做出了个JavaScript(JAVAEYE弹出登陆使用的不是JAVASCRIPT),现在把代码贴出来,希望,高手不要见笑

原理就是创建两个动态的DIV,一个当背景设置为透明,一个则加载显示页面

--------------------------------------------------------加载页面------------------------------------------------------------------------
 

js 代码
  1. function loading(){   
  2.            
  3.         var loadPage ;   
  4.         var dynDivBg = document.createElement("div");   //创建一个动态DIV   
  5.         dynDivBg.style.backgroundColor= "#C0C0C0";   
  6.         dynDivBg.style.position = "absolute";           //设置为绝对布局   
  7.         dynDivBg.style.filter = "progid:DXImageTransform.Microsoft.Alpha(opacity=50)";  //透明度设置为100%透明   
  8.         dynDivBg.style.width = "100%";                  //宽、高为满屏   
  9.         dynDivBg.style.height = "100%";   
  10.         dynDivBg.id = "dynDivBg";   
  11.   
  12.         var dynDiv = document.createElement("div");   
  13.         dynDiv.style.position = "absolute";   
  14.         dynDiv.style.backgroundColor = "red";   
  15.         dynDiv.style.borderWidth = "2px";   
  16.         dynDiv.style.borderStyle ="solid";   
  17.         dynDiv.style.borderColor ="green";   
  18.         dynDiv.style.left = "200px";   
  19.         dynDiv.style.top = "250px";   
  20.         dynDiv.id = "dynDiv";   
  21.         dynDiv.innerText = "数据加载中……"//创建内容   
  22.         document.body.insertAdjacentElement("afterBegin",dynDiv);       //最后将创建的DIV放入页面中   
  23.         document.body.insertAdjacentElement("afterBegin",dynDivBg);   
  24.     }  


--------------------------------------------------------加载显示页面-------------------------------------------------------------

js 代码
  1. function login_suc(){   
  2.         //移出父窗体的对象   
  3.         window.parent.document.body.removeChild(window.parent.document.getElementById("dynDivBg"));   
  4.         window.parent.document.body.removeChild(window.parent.document.getElementById("dynDiv"));   
  5.            
  6.            
  7.     }  
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics