Hatena Developer Centerの-webkit-animation

Hatena Developer Center
hoge Developer Center大杉、なんて思っていたら、上部の歯車が回っていることに気がついた。
最初はJavascriptかなーと思って調べていたら、どうやら違うみたい。
webkitにはCSSでアニメーションさせる機能が付いていて、それでやっているらしい。
たしかに、Chromeでは動くけどFirefoxでは動かない!
こんなのも、CSSでやっているんだって。
base.cssの、

#header-container #gear-1 {
  top:104px;
  right:293px;
 -webkit-animation: gearRollR 20s infinite linear;
}

この20sを小さくしたら回転が速くなった。
おしゃれ。