相关疑难解决方法(0)

今天(Jules Verne)谷歌的涂鸦如何运作？

我相信你们中的许多人已经检查了今天的(2011-02-08)Google的涂鸦(如果涂鸦更改,链接到CNN上的文章).它太棒了,我试着搞清楚它在Firebug中的实现,我发现的一些事情是它有大约3层图像(用于3D效果),它们是平移和旋转(-moz-transform:rotate())等等.我没有发现什么(和我的问题):

当你握住手柄时它如何隐藏我们的鼠标光标,我知道它cursor:none在CSS中,但我仍然看到这个CSS的句柄:

#verne-drag {
    background: url("logos/2011/verne-hp.png") no-repeat scroll 1000px 1000px transparent;
    cursor: pointer;/*here its pointer not none*/
    height: 150px;
    left: 565px;
    position: absolute;
    top: 15px;
    width: 150px;
    z-index: 700;
}

Run Code Online (Sandbox Code Playgroud)

它如何允许拖动手柄,并根据位置同时在9个图像之间交换.
在它的Javascript上有一些亮点(我没有在firebug中找到一个...只有那个通常用于搜索的脚本,而这个只是计算mod的小代码(可能代码的其他任务怎么样)
```
google.doodle.mod = function (a, n) {return a % n;};
2 /* !eval(new String("google.doodle.mod = function(a,n);)) */
```
Run Code Online (Sandbox Code Playgroud)

所以简单地指出它是如何实现的(我已经提到过3但是包含其他可能不那么明显的点).

图片资源供参考:

Sprite的资源