べつになんでもないこと

従来の CSS じゃマウスが放れた瞬間消えて苛つくことが多かったんですが、CSS アニメーションに対応したので「マウスが放れたら一定時間後に消す」とかできるようになりました。

これはいい。ということでGoogle検索のツールパネルに適用してみた。

※CSS アニメーションはFirefox 4.0からですので3.6以前では効果ありません。.4sがマウスがのってから開くまでの時間、.8sがマウスが離れてから閉じるまでの時間になります。

@-moz-document domain("www.google.co.jp"),
               domain("www.google.com") {
    #center_col {margin-left:8px!important;border-left:none!important;}
    #leftnav{
        position:fixed!important;
        top:114px!important;
        padding-left:4px!important;
        padding-right:0px!important;
        max-height:672px!important;
        z-index:52;
    }
    #leftnav:not(:hover){
        width:8px!important;
        background-color:#eee!important;
        -moz-transition:width 0s ease-in-out .8s !important;
    }
    #leftnav:not(:hover) > *{
        background-color:#fff;
        visibility:hidden!important;
        -moz-transition:visibility 0s ease-in-out .8s !important;
    }
    #leftnav:hover{-moz-transition:width 0s ease-in-out .4s !important;}
    #leftnav:hover > *{-moz-transition:visibility 0s ease-in-out .4s !important;}
    #leftnav > div {width:151px!important;}
    #leftnav:hover{border:1px solid red!important;}
    /* ワンダーホイール対策 */
    #tbt8{left:12px!important;}
}

画像検索で#leftnav:not(:hover) > *の-moz-transitionが効いてないようなんだけれど原因が分からない……見なかったことにしよう。orz

参考：-moz-transition - MDC

修正追加：Googleサイドバーの固定表示と自動開閉