css3遷移：異なる時間値の場合：ホバーInよりOut？

Question

基本的に私は、アイテムがマウスが

#bar{ position:fixed; bottom:-25px; } /*here you only get to see a piece of the bar */ 

#bar:hover{ transform: .2s linear; bottom:0; } 

そして

/*this only represents my made out status to cover what i need*/ 
#bar:mouseLeaved{ transform: 2s linear } 

のようなもの、それはに0.2秒かかります。この方法で、葉されたときにアイテムがより推移している別の遷移時間を持つようにしようとしています表示され、2秒隠される

私はこれをjavascriptの必要性なしですることができますか？

Answer 1

私はこのことをお勧めしたい：

#bar { transition: 2s linear; } 
#bar:hover { transition: .2s linear; } 

をそして、ときあなたのためのCSSハンドル物事の順序を聞かせて：ホバーが有効である（それは他を上書きします）。

ここにデモの作業：http://jsfiddle.net/jfriend00/Hufxa/