<script type="text/javascript"> if (window.ActiveXObject) { var ua = navigator.userAgent.toLowerCase(); var ie=ua.match(/msie ([\d.]+)/)[1] if(ie==6.0){ alert("您的浏览器版本过低,在本系统中不能达到良好的视觉效果,建议你升级到ie8以上!"); window.close(); } } </script>
单是alert()弹窗提示信息,太丑陋,而且信息内容受限制,于是我们可以单独做一层(弹出层)居中显示你需要的信息,下面是演示及代码:演示地址:http://www.yanue.net/js/isIE6.html (请用ie6查看效果)代码如下
<!DOCTYPE HTML> <html lang="en-US"> <head> <meta charset="UTF-8"> <title>ie6弹出层显示信息</title> </head> <body> <!--ie6弹出层显示信息--> <script type="text/javascript"> window.onload=function(){ var popDiv=document.getElementById("popDiv"); var acontinue=document.getElementById("acontinue"); var aClose=document.getElementById('aClose'); if (window.ActiveXObject) { var ua = navigator.userAgent.toLowerCase(); var ie=ua.match(/msie ([\d.]+)/)[1] if(ie==6.0){ popDiv.style.display="block"; acontinue.onclick=function(){ popDiv.style.display="none"; } aClose.onclick=function(){ window.close(); } } } } </script> <style type="text/css"> body{background:#fcf6f0;} *{margin:0;padding:0;} /*弹出层的STYLE*/ #popDiv { width:412px; background: #f0f0f6; border: 10px solid #e0e0e0; padding:0 0 10px 0; border-top:none; text-align: left; font-size: 12px; z-index:99; left:50%;/*FF IE7*/ top: 50%;/*FF IE7*/ margin-left:-200px!important;/*FF IE7 该值为本身宽的一半 */ margin-top:-60px!important;/*FF IE7 该值为本身高的一半*/ margin-top:0px; position:fixed!important;/*FF IE7*/ position:absolute;/*IE6*/ _top:expression(eval(document.compatMode && document.compatMode=='CSS1Compat') ? documentElement.scrollTop + (document.documentElement.clientHeight-this.offsetHeight)/2 :/*IE6*/ document.body.scrollTop + (document.body.clientHeight - this.clientHeight)/2);/*IE5 IE5.5*/ } #popDiv a{text-decoration:none;color:#f00;} #popDiv a:hover{color:#f60;} #isclose{ position:absolute; bottom:5px; right:6px; } #aClose,#acontinue{ border:1px solid #e0e0e0; padding:2px 5px; background:#f0f0f6; } #aClose:hover,#acontinue:hover{color:#f60;background:#fc6;} #bg{background:#fcf6f0;width:100%;height:100%;z-index:98;filter:Alpha(Opacity:"50")} #popDiv h1{font-size:12px;line-height:24px;background:#e0e0e0;line-height:30px;color:#333;} #popDiv h2{font-size:12px;text-indent:24px;line-height:24px;color:#333;font-weight:normal;padding:10px;} #popDiv p{line-height:24px;display:inline-block;text-indent:24px;} /*The END*/ </style> <div id="bg"></div> <div id="popDiv" style="display:none;"> <h1>贵州省志愿者信息管理系统 Ver 2.0 友情提示:</h1> <h2>您使用的是较低版本浏览器,将导致无法使用后台的部分功能。建议您使用 IE8.0 或其他较新版本浏览器,以便更好的感受本系统的各项特色功能及服务,感谢您对贵州志愿服务网的关心和支持。</h2> <p>政策咨询热线:0851-5514292</p> <p>技术支持热线:0851-6996078</p> <p id="isclose"><a title="" href="javascript:void()" id="acontinue">继续使用</a> <a title="" href="javascript:closeDiv()" id="aClose">关闭窗口</a></p> </div> <!--ie6弹出层显示信息end--> </body> </html>
ie6下效果预览如下:
这上面做的都只是针对ie6 ,js判断其他浏览器呢 请见:js判断浏览器类型及版本详细分析http://www.yanue.net/post-8.html
转载请注明:半叶寒羽
» js判断ie6 ie6完美提示框