js判断ie6 ie6完美提示框
本文发布于 12 年前, 内容可能已经过时或失效!
首先贴出判断ie6的js方法:(你可以复制代码到本地试试)
<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()弹窗提示信息,太丑陋,而且信息内容受限制,于是我们可以单独做一层(弹出层)居中显示你需要的信息
代码如下
<!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判断浏览器类型及版本详细分析: