ページの端にマウスを置いたときに、サイドバーがページの外から見えるようにスライド トランジションを行うようにする CSS をいくつか書きました。CSS は単純left:
で、サイドバーの位置を制御するクラスを追加/削除する必要があります。
#sidebarInner{
height:100%;
width:50px;
background-color:blue;
position: fixed;
-moz-transition: left .2s linear;
-webkit-transition: left .2s linear;
-o-transition: left .2s linear;
transition: left .2s linear;
z-index:2;
}
.slideLeft {
left: -100px;
}
Webkit ブラウザと Firefox で次のデモを試してください: http://jsfiddle.net/MmFnY/7/
Webkit では、青色の div に 0.2 秒のスライド左トランジションがありますが、Firefox ではそうではありません。上記のCSSの何が問題なのか誰か知っていますか?