JS实现兼容火狐及IE iframe onload属性的遮罩层隐藏

<%@ page language="java" import="java.util.*" pageEncoding="GB2312"%> <% String path = request.getContextPath(); String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "https://www.jb51.net/"; %> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <base href="https://www.jb51.net/<%=basePath%>"> <title></title> <meta http-equiv="pragma" content="no-cache"> <meta http-equiv="cache-control" content="no-cache"> <meta http-equiv="expires" content="0"> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="This is my page"> <!-- <link type="text/css" href="https://www.jb51.net/styles.css"> --> <style type="text/css"> <!-- #Layer1 { position: absolute; width: 896px; height: 472px; z-index: 1; left: 97px; top: 120px; } #Layer2 { position: absolute; width: 127px; height: 86px; z-index: 2; left: 1159px; top: 240px; } #Layer3 { position: absolute; width: 200px; height: 115px; z-index: 3; left: 404px; top: 160px; } body { background-image: url(lib/images/index111.jpg); margin-left: -10px; } .input_image{border:0px solid #808080; background-color:#006699;} --> </style> </head> <body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" oncontextmenu="return false" ondragstart="return false" onselectstart ="return false" onselect="document.selection.empty()" oncopy="document.selection.empty()" onbeforecopy="return false" onmouseup="document.selection.empty()" > <div> <img src="https://www.jb51.net/lib/images/welcome33.gif" /> </div> <div> <iframe src="https://www.jb51.net/earth.jsp"></iframe> </div> <div> <input type=image src="https://www.jb51.net/lib/images/website.jpg" alt="点击按钮查询站点分布地图"/> <br><br> <input type=image src="https://www.jb51.net/lib/images/associator.jpg" alt="点击按钮查询用户卡信息"/> <br><br> <input type=image src="https://www.jb51.net/lib/images/yichang.jpg" alt="点击按钮处理异常卡信息"/> <br><br> <input type=image src="https://www.jb51.net/lib/images/lvchang.jpg" alt="点击查看公司简介"/> </div> </body> </html> <script> var secs=20; var wait=secs*100; //切换按下时的图片 function timing(){ document.getElementById("select_ass").disabled =true; document.getElementById("select_ass").src = "lib/images/123123.jpg"; //定时切换图片 /*for(i=1;i<=(wait/100);i++) { window.setTimeout("doUpdate(" + i + ")", i * 100); } window.setTimeout("Timer()", wait); } function doUpdate(num) { if(num == (wait/100)) { document.getElementById("select_ass").src = "https://www.jb51.net/lib/images/associator.jpg"; } else { wut = (wait/100)-num; document.getElementById("select_ass").src = "lib/images/123123.jpg"; }*/ } //切换原始图片 function Timer(){ document.getElementById("select_ass").disabled =false; document.getElementById("select_ass").src = "https://www.jb51.net/lib/images/associator.jpg"; } var btMax =document.getElementById("Layer1"); website_earth.onclick= function(){ displayDiv(); btMax.innerHTML ="<iframe src=https://www.jb51.net/earth.jsp id=Layer1></iframe>"; } select_ass.onclick= function(){ displayDiv(); timing(); btMax.innerHTML ="<iframe src=Client?name=1 id=Layer1></iframe>"; //js创建iframe对象 /*var NewFrame=window.parent.document.createElement("iframe"); NewFrame.id="Layer1"; NewFrame.setAttribute("frameBorder","0"); NewFrame.setAttribute("scrolling","no"); NewFrame.setAttribute("onLoad","removeDiv()"); NewFrame.setAttribute("src","Client?name=1"); btMax.appendChild(NewFrame);*/ } yichang.onclick= function(){ displayDiv(); btMax.innerHTML ="<iframe src=Client?name=2 id=Layer1></iframe>"; } gtbike.onclick= function(){ btMax.innerHTML ="<iframe src=https://www.jb51.net/lib/images/61111.jpg id=Layer1></iframe>"; } //遮罩层显示 var mybg; displayDiv=function() { mybg = document.createElement("div"); mybg.setAttribute("id","mybg"); mybg.innerHTML="<center>正在处理中, 请稍候<img src='https://www.jb51.net/lib/images/loading.gif'></img></center>"; mybg.style.width = "100%"; mybg.style.position = "absolute";//绝对位置显示 mybg.style.top = "260"; mybg.style.left = "0"; mybg.style.zIndex = "100";//z轴位置 mybg.style.opacity = "0.8";//透明度 mybg.style.filter = "Alpha(opacity=80)";//滤镜显示透明度 document.body.appendChild(mybg); } //遮罩层移除 removeDiv=function() { document.body.removeChild(mybg); Timer(); } </script>

更多关于JavaScript相关内容感兴趣的读者可查看本站专题:《JavaScript切换特效与技巧总结》、《JavaScript动画特效与技巧汇总》、《JavaScript查找算法技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》、《JavaScript中json操作技巧总结》、《JavaScript错误与调试技巧总结》及《JavaScript数学运算用法总结

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wzfxzs.html