ICode9

精准搜索请尝试: 精确搜索
首页 > 编程语言> 文章详细

javascript – 警告那些不支持新CSS3标准的旧浏览器的用户

2019-09-02 15:45:10  阅读:225  来源: 互联网

标签:javascript css3 browser-detection redirect cross-browser


我正在尝试将不支持CSS3或iFrame的旧浏览器重定向到警告页面,在此我解释说如果它们继续存在,他们可能会遇到旧版浏览器的问题.

脚本(或其他)应该测试css3可比性而不是浏览器ID.

如果用户使用旧版浏览器查看,则显示在页面顶部的横幅也是可以接受的.

我目前正在使用:
<! - [if lt IE 9]>< div style ='clear:both;身高:200px;填充:0 0 0 15px; position:relative;'>< a href =“old”>< img src =“old-browser.jpg”border =“0”height =“153”width =“659”alt =“”/&gt ;&LT / A&GT&LT / DIV&GT&LT ENDIF] - GT!; 他们的任何人是否有这方面的经验或链接到一个例子?谢谢.

解决方法:

测试浏览器版本是一种不可靠的方法 – 许多用户不提供该信息,而其他用户则告诉您他们使用的是不同的浏览器.如果您需要特定功能,那么确定它们是否可用的唯一可靠方法是使用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.

你真的不应该在< head>中添加任何其他javascript但是,由于页面在上面的代码完成执行之前不会开始渲染.

标签:javascript,css3,browser-detection,redirect,cross-browser
来源: https://codeday.me/bug/20190902/1792167.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有