有人知道Google Interactive Doodles for Olympics是如何运作的。 http://www.google.com/doodles/soccer-2012
我发现Div是hplogo 风格就在它上面,如:
#hplogo{background:url(/logos/2012/soccer12-hp.png)....
我无法弄清楚分数的计算方式;如何移动对象等。它是一个可读的JS文件吗? 提前谢谢。
此致 同事开发者
答案 0 :(得分:6)
您知道如何使用调试器查看页面源代码吗?在Google Chrome中,只需点击 F12 即可。打开调试器,您可以看到文件。您会注意到JavaScript file。您可以通过cleaning it up使其更具可读性,但它将是压缩变量名称。
答案 1 :(得分:6)
一些涂鸦使用Canvas来显示动画。使用javascript中的计时器绘制从加载的图像中获取的不同帧。
有些人使用CSS属性background-image
。使用javascript计时器更改CSS属性background-position
以创建动画。
动画使用更多javascript进行交互。
例如:http://www.google.com/logos/2012/hurdles12-hp-sprite.png, http://www.google.com/logos/2012/basketball12-hp-anim.png