谷歌可能在这个“Gideon Sundback涂鸦”中使用了什么网络技术？

Question

谷歌可能在这个Gideon Sundback doodle (see video)中使用了什么可能的网络技术

http://www.youtube.com/watch?v=utijBRRmAJo&feature=relmfu

我真的很好奇。在web浏览器中，我们真的能做到这一点吗？我猜它不是闪光灯，否则我也不会感到奇怪。有没有源代码或类似的样本？

我猜它展示了我们现在在web技术上可以扩展多少。

Answer 1

使用画布元素<canvas>。所有现代浏览器都支持HTML5 now火狐、chrome和Opera。是的，现在的浏览器也可以做到这一点！

拉链齿从png精灵文件绘制到画布上。拉链滑块也位于该png图像中。整个交互式动画都是在Javascript中编码的。拉链剥离效果是使用context对象的arc()方法实现的，在本例中，context是2d。

只要您单击滑块，它就会隐藏所有的Dom元素-按钮和文本输入，您所看到的只是画布绘图。因为使用的是javascript代码，所以不能单独在本地html文件上重新创建效果。我认为使用了一些外部库。我不确定google.listen()方法是如何工作的，因为它没有定义。在这里查看javascript，in this thread, which is beautified javascript code, using the jsbeautifier.org