当前页面预览和关闭消息弹框、获取浏览器版本
点击预览打开一个消息框可查看内容;查看完毕,点击关闭,关闭消息框
代码:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Insert title here</title> </head> <body> <script type="text/javascript"> window.onload = function(){ document.getElementById("span").innerHTML = "您的浏览器版本为:"+getBrowser(); } //获取浏览器版本 function getBrowser() { var Sys = {}; var ua = navigator.userAgent.toLowerCase(); var re = /(msie|firefox|chrome|opera|version).*?([\d.]+)/; var m = ua.match(re); Sys.browser = m[1].replace(/version/, "'safari"); Sys.ver = m[2]; return Sys.browser + Sys.ver; } /** * 显示方法 */ function showRetMsq(id,str1,str2){ //创建DIV var autoCompanyObj = document.getElementById(id); autoCompanyObj.innerHTML="关闭"; autoCompanyObj.href = "javaScript: closeMsgFrmae('"+id+"')"; var newDiv = document.getElementById(id+"tempIframe"); if(newDiv==null){ //计算控件位置 var top=autoCompanyObj.offsetTop; var left=autoCompanyObj.offsetLeft; var autoCompanyObjTmp = autoCompanyObj; while(autoCompanyObjTmp = autoCompanyObjTmp.offsetParent) { top+=autoCompanyObjTmp.offsetTop; left+=autoCompanyObjTmp.offsetLeft; } //创建iframe newDiv = document.createElement("iframe"); newDiv.id= id+"tempIframe"; newDiv.style.position = "absolute"; newDiv.style.backgroundColor="#ffffff"; newDiv.style.top = top+autoCompanyObj.offsetHeight+"px"; newDiv.style.left = left+"px"; newDiv.style.zIndex = "999"; newDiv.style.border = "solid"; newDiv.style.borderWidth = "1px"; newDiv.style.borderColor = "#acb6dd"; document.body.appendChild(newDiv); var str1 = "Hello World!";//要显示的内容。调方法的时候传入。这里是写的固定的 //创建内容 var iframeTextContent = ''; iframeTextContent += ' <html><head></head><body><font size=2>'; iframeTextContent += "***原因/说明:<br/><hr/>"+str1+"<br/>"; //iframeTextContent += "解决方案:"+str2; iframeTextContent += '</font></body>'; iframeTextContent += ' </html>'; newDiv.contentWindow.document.open(); newDiv.contentWindow.document.write(iframeTextContent); newDiv.contentWindow.document.close(); } newDiv.style.display="block"; } /** * 关闭显示方法 */ function closeMsgFrmae(id){ var autoCompanyObj = document.getElementById(id); document.getElementById(id+"tempIframe").style.display="none"; autoCompanyObj.innerHTML="预览"; autoCompanyObj.href = "javaScript: showRetMsq('"+id+"',null,'')"; } </script> <center> <span id="span"></span> <table cellpadding="5" cellspacing="5" border="0"> <tbody> <tr> <td>姓名:Azzan</td> <td>年龄:18</td> <td>详细介绍:<a href="javaScript: showRetMsq('atest',null,'')" id="atest">预览</a></td> </tr> </tbody> </table> <!-- <a href="javaScript: showRetMsq('atest',null,'')" id="atest">预览</a> --> </center> </body> </html>效果图:
图1
图2
