[译]通过Google Chrome框架让IE变得更棒
博客专区 > boco 的博客 > 博客详情
[译]通过Google Chrome框架让IE变得更棒
boco 发表于4年前
[译]通过Google Chrome框架让IE变得更棒
  • 发表于 4年前
  • 阅读 18
  • 收藏 0
  • 点赞 0
  • 评论 0

【腾讯云】如何购买服务器最划算?>>>   

摘要: 低版本IE 运行 HTML5 和 CSS3
      上周开会,某个现行产品在低版本IE下无法正常运行,同时还不能强制让用户直接更换IE安装FireFox或Chrome浏览器,保证产品的运行必须要基于现行浏览器,可以接受安装插件。
      凭我当时了解的解决方案中,当然认为在IE7、IE8中肯定是无法运行HTML5的,虽然产品负责人一直在讲只是用了很少一部分的HTML5技术。
      产品虽然不是我们开发的,但本着技术探求和好奇心强的精神,还是在国外的技术网站了解到 Chrome Frame plugin for IE的插件。
      排查问题的思路如下:
      首先我认为BAT(百度、阿里、腾讯)企业中肯定也会遇到这个问题,因为在中国IE6的用户还有很多,他们是如何运行HTML5的页面的。所以就调试了一些页面,很显然第一步就发现了一行代码:
 
这里发现了X-UA-Compatible(文档兼容模式) 关于这个也是比较常见的,具体可以参照MSDN网站里的
Specifying legacy document modes
代码中IE=edge,Edge模式表示让当前浏览器以最高级模式渲染页面。
重点是chrome=1,下边来解释一下[译自]: Make IE awesome by turning it into Google Chrome
英文不是很好。 
译文:
       首先我确定你知道,如今Google发布了一个可以将Trident渲染引擎引入到IE浏览器的插件,Chrome Frame plugin for IE。在不久的将来那些在现在看来非常好的新特性的技术CSS3和HTML5也可以在低版本的IE中运行,也是为了即将发布的 Google Wave 做准备。
       我写过一篇文章是关于《
Google Chrome 如何改变浏览器领域》的,WEB UI的迅速发展需要感谢Google、Mozilla、Webkit和Opera。
这个插件可以帮助推动that final frontier 实现所有下一代主流浏览器兼容的工具。
       示例
DEMO       下载源文件Download the source files 
       这个示例【颗粒喷泉】略微的修改于
http://iterationsix.com/posts/16 ;
 >Google Chrome Frame 是如何工作的 
       上一个示例是利用HTML5的canvas 标签来实现颗粒效果的,如果你是用IE浏览器访问,将会弹出安装 Chrome Frame的通知栏。
备注:当然在我大大天朝内是不会弹出的,因为Google Chrome插件被“墙”了,需要翻墙了,至于翻墙的招式百度有很多。

        首先在你的Web页面中做如下设置,才可以使用Google Chrome Frame渲染。 
        <meta http-equiv="X-UA-Compatible" content="chrome=1">        
         看起来很熟悉吧,平时我们可以使用同一个meta标签实现指定某个版本的IE浏览器强制渲染。
         当你访问一个含有上数标签的网站的时候,如果你使用的IE浏览器,并且安装了Google Chrome Frame 则会使用Chrome来渲染,可以享受他的全部功能。
         下边是一个视频演示:演示的是IE8 vs IE8与cf:协议强制使用Chrome Frame,如果无法显示视频地址:http://www.screenr.com/az7
           
  >提示用户安装 Chrome Frame

        如果如果用户不知道自己有木有安装Chrome Frame插件,怎么办?这里有一个很好的解决方法,就是调用Google Ajax APIs方法如下:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/chrome-frame/1/CFInstall.min.js"> </script> 
<script type="text/javascript">
         
CFInstall.check();
 </script>
上述代码可以检查用户是否已经安装了Chrome Frame,如果没有安装则会提示用户安装,如果已经安装了则不会重复安装。
这个check方法也提供了一些参数项 可以访问:http://code.google.com/chrome/chromeframe/developers_guide.html#CFInstall_check_Options

  >强制使用Chrome Frame
    如果你热衷于使用这个框架,并且希望用户端使用这个框架,则可以通过追加cf协议在你所引用的url前。例如:
    cf:http://bespin.mozilla.com
    如果他是通过IE加载的,并且客户机已经安装了Chrome Frame插件,则会强制使用这个插件渲染页面。

 >初级阶段(2009-09-23)
    现在这个插件处于早期开发阶段,但是我相信他会迅速的完善,配合Google Wave的公开发布。
    这确实是一个令人兴奋的插件,会让一大批的用户体验到最好的WEB应用程序。

[翻完]引自http://www.thecssninja.com/javascript/make-ie-awesome

其实下边的评论也是非常有意思的,但是不必多翻译了,英文水平有限,IE低版本用户使用HTML5和CSS3的解决方案已经找到。
欢迎大家提供其他的解决方案。
共有 人打赏支持
粉丝 3
博文 42
码字总数 12855
×
boco
如果觉得我的文章对您有用,请随意打赏。您的支持将鼓励我继续创作!
* 金额(元)
¥1 ¥5 ¥10 ¥20 其他金额
打赏人
留言
* 支付类型
微信扫码支付
打赏金额:
已支付成功
打赏金额: