制作另类导航菜单全过程[1]

说明：通过这节我们学会在线模板编辑、标签的使用、以及快速建立标签和修改标签的方法

我们来实现www.phpcms.cn 主站菜单导航效果。代码如下：

<!--频道列表-->
<div id="Whatever" align="center">
<ul class="TabBarLevel1" id="TabPage1">
<li id="menu_0"><a href="{PHPCMS_PATH}" onmouseover="show_menu(0);" >首页</a></li>
<!--{loop $CHANNEL $channel}-->{php if($channel['channelid']==16) break;}
<!--假如频道id为16-->
<li id="menu_{$channel['channelid']}"><a href="{$channel[linkurl]}" onmouseover="show_menu({$channel['channelid']});" >{$channel[channelname]}</a></li>
<!--{/loop}-->
</ul>
</div>

<div id="sub_menu" style="text-align:left;background-color: #7cc2e9;" class="TabBarLevel1"></div>

<div id="menu_cont_0" style="display:none;">
<font color="#ff0000">公告：</font>{tag_网站首页最新公告}
</div>
<!--{loop $CHANNEL $channel}-->
{php if($channel['channelid']==16 || $channel['islink']) break;}
<!--假如频道id为16 或者是外部频道就不显示-->
<div id="menu_cont_{$channel['channelid']}" style="display:none;">
<a href="{$channel['linkurl']}">{$channel['channelname']}首页</a> {tag_新增频道一级栏目}
</div>
<!--{/loop}-->

</div>
<script type="text/javascript">
var tID={$channelid};
function show_menu(ID){
if(ID!=tID){
$('sub_menu').innerHTML = '&nbsp;' $('menu_cont_' ID).innerHTML;
$('menu_' ID).className = 'Selected';
$('menu_' tID).className = 'white';
tID=ID;
}else{
$('menu_' ID).className = 'Selected';
$('sub_menu').innerHTML = '&nbsp;' $('menu_cont_' ID).innerHTML;
}
}
show_menu({$channelid});
</script>
<div class="main">