php侧拉菜单 漂亮,可以向右或者向左展开,支持FF,IE

 更新时间:2009年10月15日 17:18:39   作者:  
其中menu UL UL的left或者right控制向右或者向左显示子菜单
/upload/20091015171901353.jpg
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 is_null、empty、isset的区别

    一张表搞清楚php is_null、empty、isset的区别

    这篇文章主要介绍了一张表搞清楚php is_null、empty、isset的区别,isset 判断变量是否已存在,empty 判断变量是否为空或为0,is_null 判断变量是否为NULL,需要的朋友可以参考下
    2015-07-07
  • JavaScript实现删除电脑的关机键

    JavaScript实现删除电脑的关机键

    本文给大家分享的是一个恶作剧小程序,使用JavaScript实现删除电脑的关机键,非常有意思,主要是通过ActiveX操作注册表来实现,有需要的小伙伴可以参考下
    2016-07-07
  • Composer设置忽略版本匹配的方法

    Composer设置忽略版本匹配的方法

    Composer是PHP中用来管理依赖(dependency)关系的工具。你可以在自己的项目中声明所依赖的外部工具库(libraries),Composer会帮你安装这些依赖的库文件。接下来通过本文给大家介绍Composer设置忽略版本匹配的方法,需要的朋友参考下吧
    2016-04-04
  • Laravel框架实现多个视图共享相同数据的方法详解

    Laravel框架实现多个视图共享相同数据的方法详解

    这篇文章主要介绍了Laravel框架实现多个视图共享相同数据的方法,涉及Laravel框架视图与控制器数据调用相关操作技巧,需要的朋友可以参考下
    2019-07-07
  • PHP命令行执行整合pathinfo模拟定时任务实例

    PHP命令行执行整合pathinfo模拟定时任务实例

    下面小编就为大家带来一篇PHP命令行执行整合pathinfo模拟定时任务实例。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-08-08
  • 修改destoon会员公司的伪静态中的com目录的方法

    修改destoon会员公司的伪静态中的com目录的方法

    这篇文章主要介绍了修改destoon会员公司的伪静态中的com目录的方法,在伪静态设置中很实用的技巧,需要的朋友可以参考下
    2014-08-08
  • php实现在线考试系统【附源码】

    php实现在线考试系统【附源码】

    这篇文章主要介绍了php在线考试系统附源码下载,文中通过实例代码给大家介绍了开发思路,需要的朋友可以参考下
    2018-09-09
  • Yii2框架可逆加密简单实现方法

    Yii2框架可逆加密简单实现方法

    这篇文章主要介绍了Yii2框架可逆加密简单实现方法,涉及Yii框架encryptByPassword()与decryptByPassword()函数简单使用方法,需要的朋友可以参考下
    2017-08-08
  • laravel config文件配置全局变量的例子

    laravel config文件配置全局变量的例子

    今天小编就为大家分享一篇laravel config文件配置全局变量的例子,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2019-10-10
  • php操作xml

    php操作xml

    分步学习php操作xml:XML概念、DOMDocument对象、加载xml、读取/遍历节点与属性、修改属性/节点、添加元素/属性、删除属性/节点,学会上面这些就可以顺利操作XML了。
    2013-10-10

最新评论