谷歌涂鸦互动

是否有人知道如何在谷歌涂鸦互动奥运的工作。 http://www.google.com/doodles/soccer-2012 谷歌涂鸦互动

我发现，股利是hplogo 和风格正上方，如：

 #hplogo{background:url(/logos/2012/soccer12-hp.png)....

我想不通的分数是如何计算的;对象如何移动等。它是一个可读的JS文件？在此先感谢。

真诚，一位同行开发商

来源

2012-08-10 Mahyar Ebadi

一个更重要的问题：有多少节省你需要拿金牌？ – 2012-08-10 19:32:17

哈哈很好的问题。我无法:) – 2012-08-12 07:15:54

请查看我对类似问题的回答[如何制作HTML5游戏，如Google Doodle的Doctor Who？]（http://stackoverflow.com/questions/20136141/how-to-make-html5- games-like-google-doodles-doctor-who/20150126＃20150126） – nmoliveira 2013-11-22 16:52:04

一些涂鸦帆布使用用于显示的动画。使用JavaScript中的计时器绘制从加载的图像中获取的不同帧。

一些使用CSS属性background-image。使用javascript定时器更改CSS属性background-position以创建动画。

动画正在使用更多的JavaScript做互动。

e.g：http://www.google.com/logos/2012/hurdles12-hp-sprite.png， http://www.google.com/logos/2012/basketball12-hp-anim.png

来源

2012-08-10 19:28:46 Diode

你太了不起了！我有一些XNA的经验，我想知道他们是否正在对图片进行任何更新或通过JS手动移动身体部位。非常感谢！这有助于很多。 – 2012-08-10 19:30:09

不客气:)。谷歌的涂鸦真的很棒。我认为这是最好的 - http://www.google.com/logos/2011/lespaul.html。它使用Canvas，其他HTML元素和音频。 – Diode 2012-08-10 19:40:32

哇，真的很酷:)我不知道音频可以这样使用。谢谢你，我学到了比我今天想象的更多的方式。 – 2012-08-10 20:23:21

你知道如何使用调试器查看网页源代码？在谷歌浏览器，只需点击F12。打开调试器，你可以看到这些文件。你会注意到JavaScript file。您可以通过cleaning it up使其更具可读性，但它会被压缩变量名称。

来源

2012-08-10 19:18:58 epascarello

谢谢你这就是我一直在寻找的！ – 2012-08-10 19:25:33

伟大的链接http://jsbeautifier.org/ :) – mtk 2012-08-11 14:46:59

谷歌涂鸦互动

回答

相关问题