现在5月多了,qq炫舞2.0版也出来了,请问与ie9的ie9兼容性问题...

QQ炫舞和IE9现在还不兼容么?_qq炫舞吧_百度贴吧
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&签到排名:今日本吧第个签到,本吧因你更精彩,明天继续来努力!
本吧签到人数:0成为超级会员,使用一键签到本月漏签0次!成为超级会员,赠送8张补签卡连续签到:天&&累计签到:天超级会员单次开通12个月以上,赠送连续签到卡3张
关注:935,706贴子:
QQ炫舞和IE9现在还不兼容么?收藏
以前装了开炫舞就会白屏。现在解决了么?
1楼 15:16&|
相关的贴子14911388100相关的图贴
TE9现在兼容性好多了,我以前装了IE9受不了她的兼容性又装回8.。
2楼 17:27&|
只用360的路过
3楼 17:30&|
话说这个问题炫舞早就解决了- -
4楼 17:31&|
这样啊,有白屏后来我就没玩过炫舞了……
5楼 17:33&|
登录百度帐号推荐应用
内&&容:使用签名档&&
为兴趣而生,贴吧更懂你。&或如何在ie6,ie7,ie9保持其兼容性?!
[问题点数:25分,结帖人u]
如何在ie6,ie7,ie9保持其兼容性?!
[问题点数:25分,结帖人u]
不显示删除回复
显示所有回复
显示星级回复
显示得分回复
只显示楼主
相关帖子推荐:
2014年7月 Web 开发大版内专家分月排行榜第三
2009年9月 总版技术专家分月排行榜第一
2009年8月 总版技术专家分月排行榜第二
2013年5月 总版技术专家分月排行榜第一
2014年8月 总版技术专家分月排行榜第二2014年7月 总版技术专家分月排行榜第二2013年6月 总版技术专家分月排行榜第二
匿名用户不能发表回复!|
每天回帖即可获得10分可用分!小技巧:
你还可以输入10000个字符
(Ctrl+Enter)
请遵守CSDN,不得违反国家法律法规。
转载文章请注明出自“CSDN(www.csdn.net)”。如是商业用途请联系原作者。58cv网址导航查看: 1823|回复: 11
几行代码,低版本兼容性完全不是问题
在线时间 小时
阅读权限20
马上注册,查看更多内容,享用更多功能,让你轻松玩转社区。
才可以下载或查看,没有帐号?
HTML5 有许多激动人心的特性,有了新的标签、新的CSS 能力和新的JavaScript API,Web 的能力范围有了大的飞跃。除了浏览器厂商的士气高涨之外,令人激动的新功能列表几乎每天都在增加。从“nightly builds”(每夜都构建一版)到开发渠道发行版和正常的平台预览版,浏览器在飞速变化,世界各地Web 开发人员们正在加入这个狂欢。
但是,尽管开发和浏览器社区正在把HTML5 的喧嚣推到一个极度兴奋的高潮,网上的大多数人却不像我们一样使用最新的浏览器和最新版本。如果你是一个大型开发机构的Web 开发人员或者是拥有庞大用户群的大企业,那你对此可能很清楚。即使你为通过Web 提供服务的小型机构或新创立的企业工作,你可能也要花上大量时间来确保自己的网站能够支持尽可能多的浏览器和浏览器版本。
基于这一现实,很容易看出,HTML5 还谈不到它是否已为当今的使用做好准备,而是你是否为它做好了准备。例如,假设你用一些新的语法标签(例如&header&和&article&)新建了一个页面,添加了一些新的CSS 功能,例如圆角(border-radius)和阴影(box-shadow),甚至添加了一个&canvas&元素在页面上绘制出一个HTML5 标识。
在较新的浏览器上,例如Internet Explorer 9、Firefox 4 及以上版本、或者Google Chrome上,这个页面的显示如图1 所示。但如果尝试在Internet Explorer 8 或更早的浏览器上加载页面,很有可能看到的是图2 所示的效果:一个残缺不全的页面。
如果你在研究HTML5 的所有强大功能却得到上述体验之后告诉自己说:最好还是等等,那么我不会对你有任何责怪。如果我问你准备好了吗?你很容易得出这样的结论:HTML5 还没有为你或你的用户做好准备。
在你决定等到2022 年再考虑HTML5 的之前,我建议你继续阅读本文的后面部分,我将向你提供一些实用的策略,让你现在就能采用HTML5 技术,同时避免出现图2 所示的糟糕的降级情况。我将从下面三个主题进行详细地介绍:
·功能检测与用户代理(UA)嗅探比较
·用 JavaScript 实现填补(Polyfill)
·优雅降级
这些应该可以教会你很多构建支持各种浏览器的网站所需要了解的知识。在本文结束时,你会拥有一个可靠的策略,可以充满自信、毫不犹豫地采用HTML5 技术。你还会拥有一些工具在手,可以逐步地为新浏览器增强网站,同时更好地适应旧的浏览器。因为HTML5 的采用策略就是一个浏览器也不放弃。
一、功能检测的重要性
为了提供跨浏览器的稳定且一致的体验,开发人员经常需要获得一些关于用户浏览器的信息。以前的普遍做法是像下面这样用JavaScript 检测这些信息:
这个技术称为用户代理(UA)嗅探,广泛地用于判断正在请求页面的是哪个浏览器。这里的思路是:知道了用户的浏览器(例如IE7),就能在运行的时候决定启用或禁用网站的哪项功能。UA 嗅探就相当于对浏览器说:“你是谁?”(对UA 嗅探以及其他检测技术的深入分析,请参阅h t t p : /&&/ t . c n / z O&&i 5 m 7 2 )
这种做法的问题在于,浏览器会撒谎。UA 字符串是一个用户可以配置的信息,并不会提供100%正确的浏览器信息。而且,随着这一技术的广泛采用,许多浏览器厂商在自己的UA 字符串中增加了额外内容,用来欺骗脚本,让脚本对于实际使用的浏览器做出错误判断,从而避免检测。现在有些浏览器甚至提供小工具,允许用户只要轻轻点击几下鼠标,就能修改UA 字符串。
UA 嗅探的目的从来就不是确定用户的浏览器和版本。而且它肯定也不是为了在你不喜欢用户使用的浏览器时,让你可以告诉用户说“请下载另一个浏览器”——即使有些人就是这样使用UA 嗅探技术的。用户有权选择自己使用什么浏览器,开发人员的职责则是提供最可靠且一致的体验,不要把浏览器的偏好强加给用户。UA 嗅探的目标是让你能够准确地了解在用户当前的浏览器中,有哪些能力或功能可以利用。对浏览器本身的了解,只是获得这些信息的一个途径。目前有一些UA 嗅探的替代技术,其中一项正在日益流行的技术称为对象检测或功能检测。这两个术语多数时候可以互换使用,但本文统一使用“功能检测”(feature detection)。功能检测的目标是判断某项功能或能力在用户当前的浏览器中是否受支持。如果UA 嗅探是问浏览器“你是谁”,“功能检测”就是问浏览器“你能干什么”,这个问题更直接,对于根据条件向用户提供功能来说,这种方法也更可靠。如果功能检测脚本实现正确,用户或浏览器将很难造假或错报功能支持。
二、手动功能检测
那么,与UA 嗅探的示例相比,功能检测到底是什么样呢?为了回答这个问题,我们先来看看如果在Internet Explorer 8 中查看前面的HTML5 页面(如图1 所示),如何解决出现的问题。这个页面的标签内容如代码段1 所示。
代码段1 带有HTML5 新语义标签的页面
如图1 和图2 所示,Internet Explorer 9 和 Internet Explorer 8 的显示效果有很大的差别。对于初学者来说,我的页面完全没有样式,因为这个页面的CSS 并不存在。而且,页面底部丢失了好玩的HTML5 盾牌。每个问题都可以轻松解决,而功能检测则是明确问题的第一步。两个问题的原因都很简单:对于Internet Explorer 8 来说,&header&、&article&和&canvas&都不是有效的HTML 元素,所以无法使用。要解决&canvas&问题,我们不用UA 嗅探来判断所使用的浏览器/版本,而要通过JavaScript 询问浏览器是否支持&canvas&元素和它的JavaScript API,对Canvas 的功能检测如下所示:
!!document.createElement('canvas').getContext
这条语句做了好几件事:首先,它使用两个否定(!!)操作符强行将未定义的值显式地设为false;然后,它手动新建一个canvas 元素,并将它加到DOM 中;最后,它调用getContext函数,这是&canvas&元素的一个新函数,是通过JavaScript 操纵Canvas API 的途径。如果使用IE9,则这条语句会返回true。如果使用IE8,则getContext会返回“undefined”(未定义),会被前面的两个否定操作符强行变为false。
这是最基本的功能检测。利用这条语句以及其他类似语句,就有了查询浏览器所支持功能的更可靠方法。关于手动功能检测的更多信息,请参阅d i v e i n t o h t m l 5 .&&i n f o / e v e ry&&t h i n g . h t m l
三、使用Modernizr进行功能检测
手动功能检测肯定是对UA 嗅探的提高,但这种做法仍然需要你做大量工作来检测功能是否可用,以及在功能不存在的时候决定做什么。虽然Canvas 示例很简单,只需要一行代码,但不是每个要检测的功能都这么简单——不同浏览器的检测代码也各不相同。例如,要检测是否支持前面使用的CSS3 模块(border-radius 和box-shadow)就有些麻烦。值得庆幸的是,Modernizr () 提供了更好的方法。Modernizr是一个JavaScript 库“……检测下一代 Web 技术(即源于HTML 5 和CSS3 规范的功能)的本地实现是否可用”。在页面上添加对Modernizr的引用可以提供四大功能:
1) 全面列出支持的功能,智能地加入标签,从而实现CSS 的条件定义。
2) 一个 JavaScript 对象,方便进行基于脚本的功能检测。
3) 在运行的时候将全部HTML5 新标签加入DOM,方便IE8 和之前的IE 浏览器(稍
后就会知道不仅如此)。
4) 一个脚本加载器,可以根据条件将polyfill加载到页面中。
本文对第1 项不做进一步介绍,但鼓励你访问m o d e r n i z r . c o m 网站,学习这一功能及其余功能的文档。
上面的第2 项功能,可以将下面的代码:
!!document.createElement('canvas').getContext
改为这行代码:
Modernizr.canvas
这行代码会返回一个布尔值,表明页面是否支持Canvas 元素。使用Modernizr比自行执行功能检测的好处是,Modernizr是一个经过良好测试、健壮的、广为采用的库,它已经完成了许多繁重的工作。Twitter、Google、Microsoft 以及无数其他机构和开发人员都在使用Modernizr,你当然也可以使用。在ASP.NET MVC 3 工具更新(2011 年4 月发布)中,Microsoft甚至随新的ASP.NET MVC 应用程序一起配备了Modernizr。当然,我们迄今为止所做的,不过是检测是否支持&canvas&元素。通过功能检测知道了浏览器是否支持某一功能之后,接下来通常是创建一些条件逻辑,在功能不存在的时候阻止特定代码的执行或者换个路径来执行,例如:
if (Modernizr.canvas) {
// 这里执行canvas 代码。
根据附加的浏览器功能是否存在来给网站增加功能,这种做法称为“渐进式增强”,因为体验增强针对的能力更强的浏览器。另一方面是“优雅降级”,即某项功能的缺失不会造成浏览器出错或发生故障,而是应该向用户提供一些削弱的功能或替代能力。对于旧版浏览器来说,不必将优雅降级作为默认选择。在许多情况下,甚至可能不是最佳选择。相反,在Modernizr的帮助下,你通常可以使用许多可用的浏览器polyfill,将类似于HTML5 的功能添加到不支持HTML5 的浏览器中。
四、什么是Polyfill
根据Modernizr网站的说法,polyfill是“在旧版浏览器上复制标准API 的JavaScript 补充”。“标准API”指的是HTML5 技术或功能,例如Canvas。“JavaScript 补充”指的是可以动态地加载JavaScript 代码或库,在不支持这些标准API 的浏览器中模拟它们。例如,geolocation(地理位置)polyfill可以在navigator 对象上添加全局的geolocation对象,还能添加getCurrentPosition函数以及“坐标”回调对象,所有这些都是W3C 地理位置API 定义的对象和函数。因为polyfill模拟标准API,所以能够以一种面向所有浏览器未来的方式针对这些API 进行开发,最终目标是:一旦对这些API 的支持变成绝对大多数,则可以方便地去掉polyfill,无需做任何额外工作。
通过在页面上添加对Modernizr的引用,我就得到了与代码段1 示例相关的polyfill的直接好处。页面显示没有样式,是因为IE8 不认识&article&和&header&标签。因为它不认识这些标签,所以没将它们加入DOM,而CSS 选择元素要发挥样式作用,需要在DOM 中有这些元素。当我在页面上添加&script&标签和对Modernizr的引用时,结果就有了样式,如图3 所示。我之所以得到这个好处,是因为Modernizr用JavaScript(document.CreateElement(‘nav’))手动地将所有HTML5 的新标签添加到DOM,这样CSS 就能选择标签并给标签加上样式。
除了在Internet Explorer 中添加对新的HTML5 元素的支持外,Modernizr库默认不提供任何额外的polyfill。额外的polyfill需要自行提供,或者使用自己的脚本,或者从Modernizr网站上日益增加的选项列表中选择一个。在2.0 版中,Modernizr提供了一个条件脚本加载器(基于yepnope . j s—),可以帮助你只在需要的时候异步下载polyfill库。使用Modernizr配合一个或多个polyfill库来提供需要的功能,是一个强大的组合。
五、使用Polyfill模拟HTML5 功能
对于Canvas 来说,在Modernizr和JavaScript 库excanvas的帮助下,用polyfill可以在IE8 及之前的版本中实现Canvas 支持,可以在IE6、IE7 和IE8 上添加API 级别的Canvas支持。可以从b i t . l y / b S g y N R 下载excanvas,将它添加到自己的脚本文件夹,然后在页面的脚本块中添加一些代码,如代码段2 所示。
在这里,我使用Modernizr脚本加载器指定了三件事:
1) 用来测试的Boolean 表达式。
2) 表达式测试为false 时,加载脚本的路径。
3) 检查或脚本加载完成时运行的回调。
对于Canvas 来说,在应用程序中要添加的智能处理和polyfill就是这些了。Modernizr会异步加载excanvas . j s,而且只会为那些不支持Canvas 的浏览器加载,然后加载脚本库,在页面上绘制出HTML5 标识。
下面来看另外一个示例来理解Modernizr的价值. 重视细节的你可能已经注意到,图3 中网站的样式与图1 中在 Internet Explorer 9 中显示的原始页面相同。这个页面在InternetExplorer 8 中显示时没有阴影和圆角,而我不可能让网站在没有这两个效果的情况下丑陋地交付出去,所以我们再次求助于Modernizr。
同处理Canvas 一样,Modernizr可以告诉我CSS 模块不受支持,但提供一个填补(polyfill)这些CSS 模块的库,要我来做。幸运的是,有个名为)的库在一个库中提供了这两个模块。
为了增加对圆角和阴影的支持,在下载了PIE 之后,我可以将代码段3 中的代码加入脚本。这次,我要测试是否支持圆角或阴影模块(而不是假定两者都支持或都不支持),如果有哪个模块不支持,则动态地加载PIE. j s。PIE 加载完成后,我再执行一段jQuery代码选择全部&article&标签,并调用PIE.attach函数,添加CSS 中已经定义的圆角和阴影样式。最终结果如图4 所示。
六、使用Polyfill协助进行优雅降级
除了使用这里讨论的polyfill技术,在希望应用程序优雅降级的地方也可以借助于Modernizr,而不是用另一个库进行填补(polyfill)。
假设网页上有一个Bing Maps 控件,而且我希望使用Geolocation来确定用户当前位置,然后将这个位置作为大头钉放在地图控件上。虽然新版本的浏览器都支持Geolocation,但在旧版浏览器中并不支持。纯粹使用JavaScript 提供完整的Geolocation支持还确实有些麻烦,即使有针对Geolocation的填补(polyfill)
实现起来也不轻松,所以我决定要对自己的应用程序进行优雅降级。当用户的浏览器不支持Geolocation时,我会提供一个表单,用户可以在表单中手动输入位置,我将用用户输入的位置定位和固定地图。
通过Modernizr,只要用一个简单的加载脚本,调用我创建的两个脚本中的一个即可,如代码段4 所示。在这个示例中,我测试的是Modernizr.geolocation属性。如果为true(“yep”分支),就加载fullGeolocation. j s 脚本,这个脚本使用Geolocation API 定位(要得到用户许可),并将位置放在地图上,如图5 所示。如果测试为false(“nope”分支),则加载备用脚本,在页面上显示一个地址表单。用户提交表单时,我会使用用户提供的地址将地图居中并固定,如图6 所示。这样,我的页面为最新的浏览器提供了优秀的体验,同时对旧版浏览器提供了降级到合理替代品的优雅方式。
在面对庞大的用户群仍然使用旧版浏览器的时候,很容易认为HTML5 的一些高级功能对你的网站不适用。但是现在已经有了很好的解决方案,不仅能够帮助你优雅地降级,还能提升旧版浏览器的能力,让你的用户立即就能体验到HTML5 的能力。在本文中,你看到了功能检测、Modernizr和polyfill,所以你可以毫不迟疑地采用HTML5,既满足日益增长的使用最新浏览器的用户,又不会丢失使用旧版浏览器的庞大用户群。而我们要做的,不光是让网站适应旧版浏览器,更多的是要让用户更好的体验到网站的内容,如果你想要了解更多内容,可以参考下IE10兼容性白皮书,相信你会获得很多帮助,下载地址:h t t p: / / v d i s k . w e&&i b o . c o m / s /&&b K g e q
在线时间 小时
阅读权限15
HTML5的优雅降级功能 为我们带来更多的好处了
在线时间 小时
阅读权限30
唉,真是感叹为浏览器就没有个统一的标准和向下兼容的特性呢!!
在线时间 小时
阅读权限10
应该没问题吧。嘿嘿,我是这样觉得
在线时间 小时
头像被屏蔽
提示: 作者被禁止或删除 内容自动屏蔽
在线时间 小时
头像被屏蔽
提示: 作者被禁止或删除 内容自动屏蔽
在线时间 小时
头像被屏蔽
提示: 作者被禁止或删除 内容自动屏蔽
在线时间 小时
阅读权限10
忙碌的工作中轻松一下啊!超多搞笑图片
由于权限问题不能直接发视频。。给大家分享几个好看的视频。想看的自己点击下面的网址就可以看了!
1小时超过1百万的点击量
/refer/_rHWZGV-nPB8Tpm-Ef150g../v.swf&auto=1
屌丝男的最爱
/refer/xtNmdD_bwgzT9gjM2xaaCQ../v.swf&auto=1
女神每天必做的事情
/refer/_zTC4gAGqE-qyH_DQ0LoCQ../v.swf&auto=1
在线时间 小时
头像被屏蔽
提示: 作者被禁止或删除 内容自动屏蔽
在线时间 小时
阅读权限10
回复那东西了呵呵……
( 鄂ICP备号 )&&
Powered by Discuz! X3.2
Comsenz Inc.}

我要回帖

更多关于 ie9兼容性问题 的文章

更多推荐

版权声明:文章内容来源于网络,版权归原作者所有,如有侵权请点击这里与我们联系,我们将及时删除。

点击添加站长微信