dede5.7测试有效,转载请著名出处：http://tyllxx.iteye.com
?
要求在网站的子页面中时，主菜单显示其所在栏目。如图
然后鼠标上去
?到新闻资讯页后，鼠标离开
?
以上效果直接使用同一个head.htm文件引用实现，力求最简，考虑过循环的方式，但是循环体中无法判断当前所在栏目。
?
<ul class="nav">
<li class='nav0{dede:field name="typeid" runphp="yes" function="GetTopid(@me)"} if(@me!="1"&@me!="2"&@me!="3"&@me!="4"&@me!="5"&@me!="6")@me=" clock_on0"; else @me="";{/dede:field}'><a href="/"></a></li>
<li class='nav1{dede:field name="typeid" runphp="yes" function="GetTopid(@me)"} if(@me=="1")@me=" clock_on1"; else @me="";{/dede:field}'><a href="/About_us"></a></li>
<li class='nav2{dede:field name="typeid" runphp="yes" function="GetTopid(@me)"} if(@me=="2")@me=" clock_on2"; else @me="";{/dede:field}'><a href="/News"></a></li>
<li class='nav3{dede:field name="typeid" runphp="yes" function="GetTopid(@me)"} if(@me=="3")@me=" clock_on3"; else @me="";{/dede:field}'><a href="/Service"></a></li>
<li class='nav4{dede:field name="typeid" runphp="yes" function="GetTopid(@me)"} if(@me=="4")@me=" clock_on4"; else @me="";{/dede:field}'><a href="/Works"></a></li>
<li class='nav5{dede:field name="typeid" runphp="yes" function="GetTopid(@me)"} if(@me=="5")@me=" clock_on5"; else @me="";{/dede:field}'><a href="/Join"></a></li>
<li class='nav6{dede:field name="typeid" runphp="yes" function="GetTopid(@me)"} if(@me=="6")@me=" clock_on6"; else @me="";{/dede:field}'><a href="/Contact"></a></li>
</ul>
if(@me=="5")部分是判断栏目的顶级ID，根据需要修改，A标签中的连接需手动添加，名称按需求添加。以上用的是图片，所以A标签中无内容。
?
以下下是配套的CSS代码，取用请根据个人的需求修改。
?
?
ul.nav{margin: 0 auto; padding: 0 5px; width: 960px; height: 39px;background-image: url(../images/nav_bg.png); background-repeat: no-repeat; background-position: top center; clear: both;}
ul.nav li{width: 137px; height: 39px; float: left;}
ul.nav li a{ display: block; width: 137px; height: 39px;}
ul.nav li.nav0,ul.nav li.nav0 a{width: 138px;}
ul.nav li.nav0 a:hover,ul.nav li.clock_on0 a{background: url(../images/nav_bg.png) -5px -39px no-repeat;}
ul.nav li.nav1 a:hover,ul.nav li.clock_on1 a{background: url(../images/nav_bg.png) -143px -39px no-repeat;}
ul.nav li.nav2 a:hover,ul.nav li.clock_on2 a{background: url(../images/nav_bg.png) -280px -39px no-repeat;}
ul.nav li.nav3 a:hover,ul.nav li.clock_on3 a{background: url(../images/nav_bg.png) -417px -39px no-repeat;}
ul.nav li.nav4 a:hover,ul.nav li.clock_on4 a{background: url(../images/nav_bg.png) -554px -39px no-repeat;}
ul.nav li.nav5 a:hover,ul.nav li.clock_on5 a{background: url(../images/nav_bg.png) -691px -39px no-repeat;}
ul.nav li.nav6 a:hover,ul.nav li.clock_on6 a{background: url(../images/nav_bg.png) -828px -39px no-repeat;}
CSS所配图片的样式：一张图片上下层
?
关于其中的一些问题：
?
1. {dede:field name="typeid"不能写成{dede:field.typeid 的形式，否则后台生成是会提示错误。
2. if判断不能用iif来做，经测试无效，也许是5.7不支持iif了。
?
转载请著名出处：http://tyllxx.iteye.com