1 aaaaaaaaaaaaaaaaaaaaa
2 bbbbbbbbbbbbbbbbbbbbbb
3 ccccccccccccccccccccccc
4 ddddddddddddddddddddddd
5 eeeeeeeeeeeeeeeeeeeeeeee
6 ffffffffffffffffffffffff
* { margin:0; padding:0; } .box { width:100%; height:84%; overflow:hidden; cursor:move; } .box p { width:40%; margin:0 auto 10px; font-size:14px; height:46px; line-height:46px; cursor:pointer; overflow:hidden; position:relative; text-indent:55px; transition:.7s; } .box p span { position:absolute; width:30px; height:30px; border:1px solid #333; transform:rotate(45deg); top:7px; left:7px; transition:.7s; margin-left:0; } .box p font { position:absolute; width:46px; height:46px; text-indent:0; text-align:center; left:0; top:0; transform:rotate(-45deg) translate(0,-10px); } .box p:hover span { left:82%; transform:rotate(405deg); border-color:#fff; background:#fff; color:#f60; } .box p:hover { background:#f60; color:#fff; }
鼠标滑入时,左边数字菜单栏跑到右边来,并且背景色改变