站长资源网络编程 php侧拉菜单 漂亮,可以向右或者向左展开,支持FF,IE 整理:jimmy2024/10/30浏览2次 站长资源 网络编程 网盘链接 云盘下载 简介IE8必须增加子菜单,隐藏 复制代码 代码如下: IE8必须增加子菜单,隐藏 复制代码 代码如下: <link href="../css/right_menu.css" rel="stylesheet" type="text/css"> <DIV class=c_l> <DIV class=menu> <UL> <?php mysql_select_db($database_lr, $lr); $query = mysql_query("SELECT * FROM bigclass order by sort"); while($row=mysql_fetch_array($query)) { $bigclassid=$row['bigclassid']; $bigclassname_leftmenu=$row['bigclassname']; if ($htmlname==1){ $bigclass_htmlname_leftmenu=$bigclassname_leftmenu;//大类名称 $bigclass_htmlname_leftmenu=tihuan($bigclass_htmlname_leftmenu); } if ($htmlname==0){ $bigclass_htmlname_leftmenu=$bigclassid; } ?> <LI <?php //<!--判断是否有小类别--> mysql_select_db($database_lr, $lr); $query_num="select count(*) from smallclass where bigclassid='$bigclassid'"; $rs_num=mysql_query($query_num); $myrow_num = @mysql_fetch_array($rs_num); $smallclass_num=$myrow_num[0]; if ($smallclass_num>0){ echo "id=arrow"; } ? <a href="<?php echo "../".$htmlcatalogue."".$bigclass_htmlname_leftmenu.".html"?>" class="bigclasslink" > <?php echo $row['bigclassname']?><!--[if IE 7]> <!--></a><!--<![endif]--><!--[if lte IE 6]><table><tr><td><![endif]--> <?php mysql_select_db($database_lr, $lr); $query_small = mysql_query("SELECT * FROM smallclass where bigclassid='$bigclassid' order by sort"); if ($smallclass_num==0) { echo "<ul style='display:none'><LI><A title= href=></A> </LI></ul>"; } else { ?> <UL> <?php while($rs=mysql_fetch_array($query_small)) { $smallclassid_small_leftmenu=$rs['smallclassid']; $smallclassname_small=$rs['smallclassname'];//小类名称 if ($htmlname==1){ $smallclass_htmlname=$smallclassname_small; $smallclass_htmlname= tihuan($smallclass_htmlname); } if ($htmlname==0){ $smallclass_htmlname=$smallclassid_small_leftmenu; } ?> <LI class=b_top> <a href="<?php echo "../".$htmlcatalogue."".$bigclass_htmlname_leftmenu."_".$smallclass_htmlname."_page_1.html"?>" class="smallclasslink"><?php echo $rs['smallclassname']?></a> <!--[if lte IE 6.5]><![endif]--> </LI> <?php } ?> </UL> <?php }?> <!--[if lte IE 6]></td></tr></table></a><![endif]--></LI> <?php } ?> </UL> </DIV></DIV> CSS文件 复制代码 代码如下: UL { PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: none } LI { PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: none } .c_l { FLOAT: left; WIDTH: 200px; background:url(../images/right_menu_bg.jpg); } .menu { Z-INDEX: 9999; MARGIN-BOTTOM: 10px; WIDTH: 198px; } .menu LI { FONT-WEIGHT: bold;FLOAT: left; WIDTH: 198px; LINE-HEIGHT: 26px; HEIGHT: 26px ; /* BACKGROUND: url(../images/line01.gif) repeat-x 50% bottom; */ } .menu LI A { LINE-HEIGHT: 26px; HEIGHT: 26px ; /* BACKGROUND: url(../images/line01.gif) repeat-x 50% bottom; */ } #arrow{ BACKGROUND: url(../images/aw02.gif) no-repeat 185px 10px; LINE-HEIGHT: 26px; HEIGHT: 26px ; } .menu LI A:hover { BACKGROUND: #eeeeee; LINE-HEIGHT: 26px; POSITION: relative; HEIGHT: 26px } .menu UL UL { Z-INDEX: 9999; right: 185px; POSITION: absolute; TOP: -10000000px;background:url(../images/right_menu_bg.jpg);/*smallclass right kongzhi celafangxiang*/ } .menu UL UL LI { DISPLAY: block; FONT-WEIGHT: normal; BACKGROUND: url(../images/aw02.gif) no-repeat 10px 10px; LINE-HEIGHT: 25px! important; TOP: 0px! important; HEIGHT: 25px! important } .menu UL UL .b_top { BORDER-LEFT-WIDTH: 0px; WIDTH: 199px; } .menu UL UL .b_top A { DISPLAY: block } .menu A { PADDING-RIGHT: 0px; DISPLAY: block; PADDING-LEFT: 0px; FLOAT: left; PADDING-BOTTOM: 0px; WIDTH: 198px; TEXT-INDENT: 18px; PADDING-TOP: 0px; TEXT-DECORATION: none } .menu A:visited { PADDING-RIGHT: 0px; DISPLAY: block; PADDING-LEFT: 0px; FLOAT: left; PADDING-BOTTOM: 0px; WIDTH: 198px; TEXT-INDENT: 18px; PADDING-TOP: 0px; TEXT-DECORATION: none } .menu UL UL LI A { DISPLAY: block; BACKGROUND: none transparent scroll repeat 0% 0%; COLOR: #000; TOP: 0px! important; HEIGHT: 25px! important } .menu UL UL LI A:visited { DISPLAY: block; BACKGROUND: none transparent scroll repeat 0% 0%; COLOR: #000; TOP: 0px! important; HEIGHT: 25px! important } .menu UL UL LI A:hover { DISPLAY: block; BACKGROUND: url(../images/aw02.gif) #eee no-repeat 10px 10px; WIDTH: 198px; COLOR: #d15400; BORDER-TOP-STYLE: none; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; TOP: 0px! important; HEIGHT: 25px! important; BORDER-BOTTOM-STYLE: none } .menu TABLE { PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; WIDTH: 0px; PADDING-TOP: 0px; BORDER-COLLAPSE: collapse; HEIGHT: 0px } * HTML .menu A:hover { POSITION: relative } .menu LI:hover { POSITION: relative } .menu UL :hover UL { TOP: -1px } .menu UL LI:hover > A { BACKGROUND: #eee; POSITION: relative; TEXT-DECORATION: none } .menu UL LI UL LI:hover > A { BORDER-TOP-STYLE: none; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; POSITION: relative; TOP: 0px; BORDER-BOTTOM-STYLE: none } 其中menu UL UL的left或者right控制向右或者向左显示子菜单 上一篇:php foreach、while性能比较 下一篇:php 数学运算验证码实现代码 最新资源 降央卓玛《降央卓玛》[320K/MP3][108.63MB] 降央卓玛《降央卓玛》[FLAC/分轨][292.13MB] 任然《渐晚》[320K/MP3][27.92MB] 《原神》5.1月亮还没有出来成就获取攻略 秘源机 《原神》希诺宁详细培养一图流 希诺宁加点出装与 10月新增八个爆料,最新内容爆料一览分享 萧亚轩.2003-爱上爱【维京】【WAV+CUE】 群星.1989-宝丽金88雷射金曲【宝丽金】【WAV+CU 陈奕迅.2008-不想放手(国)【新艺宝】【WAV+CUE】 炉石传说2024万圣节活动攻略 2024万圣节活动介绍