让效果说话 8款主流浏览器网页特效实测

中关村在线西安站·三秦IT网 作者:ZOL 编辑:田源 07-23

HTML5实例测试:ChromeIE9完胜

    HTML5实例测试我们选择的是一个Web版钢琴应用,主要测试浏览器对HTML5声音、动态效果、用户交互的处理情况。用户可以从下拉列表中选择曲目播放,在播放的同时下方会有像劲乐团等弹奏游戏那样的条形音符向上滚动,也可以用鼠标点击钢琴键盘自己弹奏。


让网页说话 8款PC浏览器页面效果实测
HTML5钢琴实例

    需要说明的是,在钢琴实例中测试交互能力时,我们采用的方法是用鼠标先从左到右,再从右到左从钢琴键盘上快速滑过,检查鼠标滑过时琴键动作是否流畅,是否每个音阶都能来得及发出声音。因为如果浏览器处理得不好,就会出现琴键动作的速度赶不上鼠标操作速度,从而出现动作和声音滞后的问题。

    为了保证测试结果的公平性,在测试过程中所有浏览器选择的都是第64首曲目。

    8款浏览器HTML5实例测试结果:

浏览器名称 声音 动态效果 交互
Google Chrome浏览器 流畅 流畅
IE9浏览器 流畅 流畅
Firefox浏览器 略卡 动作和声音比操作滞后
Opera浏览器 动作和声音比操作滞后
Safari浏览器 无法打开页面
搜狗浏览器 略卡 操作流畅,没有声音
QQ浏览器 略卡 操作流畅,没有声音
傲游浏览器 略卡 动作和声音比操作稍有滞后

    经测试,除了Safari一直处于读取状态,无法打开页面之外,其余7款浏览器都可以正常打开,但搜狗和QQ浏览器播放音乐时没有声音。在动态效果方面,Chrome和IE9的音符滚动最流畅,其余6款浏览器都会有不同程度的卡顿现象。而在进行交互时,Chrome、IE9、搜狗和QQ浏览器的操作都很流畅,只可惜搜狗和QQ浏览器没有声音;而Firefox、Opera和傲游浏览器,鼠标滑过琴键时的动作和声音就不够连续。

    感兴趣的用户也可以打开HTML5钢琴实例测试一下自己的浏览器。

三秦IT网的官方微信:更多资讯请关注:三秦IT网官方微博

图片新闻
ZOL产品报价:手机报价 笔记本报价 数码相机报价 服务器报价 MP3报价 MP4报价 投影机报价 数码摄像机报价 硬盘报价 内存报价
ZOL笔记本报价: 戴尔笔记本 联想笔记本 惠普笔记本 ThinkPad笔记本 神舟笔记本 索尼笔记本 华硕笔记本 三星笔记本 东芝笔记本 苹果笔记本
ZOL手机报价:诺基亚手机 MOTO手机 三星手机 索爱手机 多普达手机 联想手机 CECT手机 IPHONE手机 魅族手机 天语手机 LG手机
ZOL数码相机报价:佳能数码相机 索尼数码相机 三星数码相机 尼康数码相机 松下数码相机 理光数码相机 奥林巴斯数码相机 柯达数码相机