HTML代码：
[html] view plaincopy
-
-
-
-
- side menu
-
-
-
-
- 主菜单01
-
- 子菜单11
- 子菜单12
- 子菜单13
-
-
-
- 主菜单02
-
- 子菜单21
- 子菜单22
- 子菜单23
-
-
-
- 主菜单03
-
- 子菜单31
- 子菜单32
- 子菜单33
-
-
-
- 主菜单04
-
- 子菜单41
- 子菜单42
- 子菜单43
-
-
-
- 主菜单05
-
- 子菜单51
- 子菜单52
- 子菜单53
-
-
-
-
-
CSS代码：
[css] view plaincopy
- #menu {}
- .m-one {float:left;width:100px;height:40px;line-height:40px; text-align:center; background:#eeeeee;}
- .m-one:hover{background:#dddddd;}
- ul,li {list-style:none; margin:0;padding:0;}
- .m-ul {background:#dddddd; display:none;}
- .m-li {font-size:12px; height:25px; line-height:25px;}
- .m-li:hover {background:#cccccc;}
JQUERY代码：
[javascript] view plaincopy
- $(document).ready(function() {
- $('.m-one').hover(
- function(){$(this).children('.m-ul').slideDown(200);},
- function(){$(this).children('.m-ul').slideUp(200);}
- );
- });
|
收藏