PHP2008漂亮的蓝色导航下拉菜单-phpcms教程-网页制作大宝库

先看效果图

IE6下浏览

IE7下浏览

IE8下浏览

火狐下浏览

opera浏览

这是jquery代码加到页头

});
});

</script>

这是导航代码把原先的div直接替换成下面的代码

<div id="menu">
<ul>
<li><a href="" id="menu_phpcms">首页</a></li>
{php $CATE = cache_read('category.php');}




<li><a href="{$r[url]}" id="menu_{$r[catid]}">{$cat[catname]}</a>
{if $CATEGORY[$cat[catid]][child] }
<ul class="nav">{get sql="select catname,url from phpcms_category where parentid='$i'" return="v"}
<p><a href="{$v[url]}">{$v[catname]}</a></p>{/get}</ul>
{/if}
</li>




</ul>
</div>

css是根据默认模板修改的 base.css

/*菜单*/
#menu{ background:url(images/bg_2.jpg) repeat-x 0 -5px;}

#menu ul li{ /*display:inline;*/ background:url(images/header_interval.gif) no-repeat 0 center; margin-left:-2px;float:left;/*position: relative;*/line-height: 30px; text-align:left}
#menu ul li a{ display:block; float:left;color:#fff; padding:0 1em; margin-left:2px; font-size:14px;}
/*#menu ul li a span{padding:4px 10px 0;}*/
#menu li a:hover, #menu li.hover a { background:url(images/topnav_hover.gif) no-repeat center top; }
#menu ul li a:hover span,#menu ul li a.selected span{ /*background: url(images/bg_menu_r.gif) no-repeat right 0; padding:4px 10px 0;*

(责任编辑：大宝库)