dab*_*aba 3 javascript redirect cross-browser browser-detection css3
我正在尝试将不支持CSS3或iFrame的旧浏览器重定向到警告页面,在此我解释说如果它们继续存在,他们可能会遇到旧版浏览器的问题.
脚本(或其他)应该测试css3可比性而不是浏览器ID.
如果用户使用旧版浏览器查看,则显示在页面顶部的横幅也是可以接受的.
我目前正在使用:
<!--[if lt IE 9]><div style=' clear: both; height: 200px; padding:0 0 0 15px; position: relative;'><a href="old"><img src="old-browser.jpg" border="0" height="153" width="659" alt="" /></a></div><![endif]-->
他们的任何人是否有这方面的经验或链接到一个例子？谢谢.
小智 6
测试浏览器版本是一种不可靠的方法 - 许多用户不提供这些信息,而其他用户则告诉您他们使用的是不同的浏览器.如果您需要特定功能,那么确定它们是否可用的唯一可靠方法是使用javascript来查看它们是否存在.
您是否决定重定向,而不仅仅是更改显示的内容？因为更改当前页面的内容会简单得多.只需在页面中添加以下内容即可:
<div id='warning'>Your browser sucks!</div>
CSS:
#warning {
/* make this DIV very visible - you could even cover the rest
of the page if your website is useless without javascript. */
}
现在页面将加载显示#warning,如果存在所需的功能,您可以使用javascript隐藏它(您不想执行反向并使用javascript来显示它,因为如果您的脚本没有显示它,则显示它) t run).有很多方法可以做到这一点,最"标准"的方法是附加一个onload事件.然而,这是一种情况,我认为一种hackish方法要好得多.如果你进行测试加载,那么警告将一直显示,直到javascript执行,这可能是从几分之一秒到几秒钟的任何时间.你真正想要做的是在元素显示之前隐藏它,你可以通过在这个<head>部分添加这样的东西来实现.
if((function() {
var t,u,i,j,
css='textShadow,textStroke,boxShadow,borderRadius,borderImage,opacity'.split(','),
prefixes=',webkit,moz,o,ms,khtml'.split(','),
nPrefixes=prefixes.length,
el=document.createElement('i').style;
styles:for(i=0;t=css[i];i++) {
t=t.charAt(0).toUpperCase()+t.substr(1);
for(j=0;j<nPrefixes;j++) {
u=prefixes[j]+t;
if(el[u.charAt(0).toLowerCase()+u.substr(1)]!==undefined)
continue styles;
}
return false;
}
return true;
})())
document.write("<style type='text/css'>#warning {display:none;}</style>");
根据您的示例,这假设您需要的功能是textShadow,textStroke,boxShadow,borderRadius,borderImage和opacity.
你真的不应该放任何其他的javascript <head>,因为页面将不会开始渲染,直到它上面的代码完成执行.
| 归档时间： |
|
| 查看次数： |
6238 次 |
| 最近记录： |