天下网吧 >> 网吧天地 >> 网吧游戏 >> 网咖游戏 >> 正文

Google为了纪念pacman游戏30周年

2010-5-23未知佚名

Google为了纪念pacman游戏30周年,推出了一个特别的Doodle,它是用javascript来实现的,使用chromuim浏览器附带的审查元素的功能来看下它都是有哪些部分组成的吧。另外这里也保存了一份游戏存档,以后google撤掉这个游戏的时候还可以玩玩。

点击进入google首页试玩

 

下面是游戏的截图:

Google首页pacman 30周年的Doodle

是有单人和双人模式的,有兴趣的可以玩玩,我感兴趣的是他是用什么东西来做的,有可能是flash,java applet(很古老了,应该不太可能),或者js,直觉应该是js,先在上面点击右键试试,是普通的网页右键菜单,应该不会是flash了,因为 falsh应该会占据顶端的,不然无法获取输入。

那就简单来分析一下吧,刚好昨天装上了chromium,就用它的元素审查来看下都有哪些元素,使用了哪些脚本。

静态背景用css指定div的背景background:black url(logos/pacman10-hp.png),怪不得不能另存为图片。

顺便看下,动画导航按钮不是flash,而是静态png切图得到的多帧画面,使用js(实现
在/extern_js/f/CgV6aC1DThICaGsrMAo4aEACLCswDjgPLCswETgYLCswFjgWLCswFzgHLCswGDgFLCswGTggLCswJTjKiAEsKzAmOAssKzAnOA
QsKzA8OAIsKzBAOBAsKzBBOAUsKzBFOAEsKzBOOAUsKzBROAIsgAIT/EFpRjNs4MoY.js) 来切图以及显示,具体原理没有细看(很多js匿名
函数,临时变量名,排版成一行–googlecode里面好像有个这样的工具,很多js函数我不熟悉等 等原因导致不想看下去),也许是
js可以控制一个图片的显示区域,这样根据鼠标的行为来切换dom树里面的元素即可。严重怀疑这样的代 码应该是由软件生成而不
是人写的,难道是google wrt之类的开发工具(这类工具我也没有了解)。

动画导航按钮不是flash,而是静态png切图得到的多帧画面,使用js(实现
在/extern_js/f/CgV6aC1DThICaGsrMAo4aEACLCswDjgPLCswETgYLCswFjgWLCswFzgHLCswGDgFLCswGTggLCswJTjKiAEsKzAmOAssKzAnOA
QsKzA8OAIsKzBAOBAsKzBBOAUsKzBFOAEsKzBOOAUsKzBROAIsgAIT/EFpRjNs4MoY.js)来切 图以及显示,具体原理没有细看(很多js匿名
函数,临时变量名,排版成一行–googlecode里面好像有个这样的工具,很多js函数我不熟悉等等原因导致不想看下去),也许是
js可以控制一个图片的显示区域,这样根据鼠标的行为来切换dom树里面的元素即可。严重怀疑这样的代码应该是由软件生成而不
是人写的,难道是google wrt之类的开发工具(这类工具我也没有了解)。

通过window.setTimeout()从pacman10-hp.3.js加载pacman游戏相关代码。 a=document.createElement

(“script”);a.type=”text/javascript”;a.src=”logos/js/pacman10- hp.3.js”;google.dom.append(a)。

js里面用到的图片来自pacman10-hp-sprite.png,也是一个图片集合。另外,双人游戏的图片来自pacman10- hp-sprite-2.png,

声音文件是pacman10-hp-sound.swf。

根据上面的分析的结果,把文件保存下本地,在chromuim上面是可以玩的,并且没有发现有外链别的资源。在ie貌似不行,有可能是因为js或者 css里面的相对路径定义在各个浏览器之间存在一些兼容性问题,也可能是ie对我改过的源文件支持不好吧(我乱删除了一些影响阅读的东西,可能破坏了一些 完整性)。

下面是我打包的出来的google首页,可以直接玩了。

点此下载pacman.zip, 我顺便也解压了一份到http://blog.antsense.com/wp-content/uploads/2010/05/pacman/, 可以直接玩。(注:在logo上面三击,然后耐心等待脚本、图片加载完毕就可以玩了,2人的这里玩不了,我还没去看insert coin涉及到什么操作。要是自己部署的话,需要自己修改下源码里面的路径)。

本文来源:未知 作者:佚名

声明
声明:本站所发表的文章、评论及图片仅代表作者本人观点,与本站立场无关。文章是出于传递更多信息之目的。若有来源标注错误或侵犯了您的合法权益,请作者持权属证明与本网联系,我们将及时更正、删除,谢谢。 Email:support@txwb.com,系统开号,技术支持,服务联系微信:_WX_1_本站所有有注明来源为天下网吧或天下网吧论坛的原创作品,各位转载时请注明来源链接!
天下网吧·网吧天下
  • 本周热门
  • 本月热门
  • 阅读排行