12.5 应用举例 栏目高亮

帝国cms设置，一级栏目高亮，并且二级栏目增加一个类名，class="sub"。用灵动标签可以实现，先获取一级栏目的地址，然后再判断是否是终极栏目，是的话，就添加样式sub，不是终极栏目就为空

<ul id="starlist">
     <li><a href="[!--news.url--]" title="首页">网站首页</a></li> 
[e:loop={"select classid,classname,islast,showclass from {$dbtbpre}enewsclass where bclassid=0 and showclass=0 order by myorder,classid asc",0,24,0}] 
<?php 
$classurl=sys_ReturnBqClassname($bqr,9);//取得栏目地址 
$class=""; 
if($GLOBALS[navclassid]){ 
$fcr=explode('|',$class_r[$GLOBALS[navclassid]][featherclass]); 
$topbclassid=$fcr[1]?$fcr[1]:$GLOBALS[navclassid];//取得当前栏目的一级栏目ID 
if($bqr[classid]==$topbclassid) 
{ 
$class='class="selected"'; 
} 
} 
?> 
<li <?=$class?>><a href="<?=$classurl?>"><?=$bqr[classname]?></a>
<?php
if(!$bqr[islast]) //判断是否终极栏目
{ 
$classsub='<ul class="sub">'; 
$classsubend='</ul>'; 
} 
else
{ 
$classsub=''; 
$classsubend=''; 
}
{
?>
   <?=$classsub?>
    <?php
    //取得栏目下的子栏目       
    $newsclass=$empire->query("select classid,classname from ".$dbtbpre."enewsclass where bclassid=".$bqr[classid]." order by myorder,classid desc");
    while($classr=$empire->fetch($newsclass))
    {
        $classrurl=sys_ReturnBqClassname($classr,9); //取得子栏目地址
        ?>
        <li><a href="<?=$classrurl?>" ><?=$classr[classname]?></a></li>
    <?php
    }
    ?>
  <?=$classsubend?>
<?php
}
?>
</li> 
[/e:loop] 
    </ul>

一级栏目高亮“selected”，并且增加样式“menu”

<ul > 
<li><a href="[!--news.url--]" title="首页">首页</a></li> 
[e:loop={"select classid,classname,islast from {$dbtbpre}enewsclass where bclassid=0 order by myorder,classid asc",0,24,0}] 
<?php 
$classurl=sys_ReturnBqClassname($bqr,9);//取得栏目地址 
$class=""; 
if($GLOBALS[navclassid]){ 
$fcr=explode('|',$class_r[$GLOBALS[navclassid]][featherclass]); 
$topbclassid=$fcr[1]?$fcr[1]:$GLOBALS[navclassid];//取得当前栏目的一级栏目ID 
if($bqr[classid]==$topbclassid) 
{ 
$class='class="selected menu"'; 
} 
else if(!$bqr[islast]) //判断是否终极栏目
{ 
$class='class="menu"'; 
} 
} 
?> 
<li <?=$class?>><a href="<?=$classurl?>"><?=$bqr[classname]?></a>
    <ul>
    <?php
    //取得栏目下的子栏目       
    $newsclass=$empire->query("select classid,classname from ".$dbtbpre."enewsclass where bclassid=".$bqr[classid]." order by myorder,classid desc");
    while($classr=$empire->fetch($newsclass))
    {
        $classrurl=sys_ReturnBqClassname($classr,9); //取得子栏目地址
        ?>
        <li><a href="<?=$classrurl?>" target="_blank"><?=$classr[classname]?></a></li>
    <?php
    }
    ?>
    </ul>
</li> 
[/e:loop] 
</ul>
<style>
.selected > a{color:red}
</style>

方案三： （判断是否存在子栏目）

 <nav>
<ul id="starlist">
     <li><a href="[!--news.url--]" title="首页">网站首页</a></li> 
[e:loop={"select classid,classname,islast,sonclass from {$dbtbpre}enewsclass where bclassid=0 and showclass=0 order by myorder,classid ASC",0,24,0}]
<?php $classurl=sys_ReturnBqClassname($bqr,0);//取得栏目地址 ?>
  <?php
if($bqr[sonclass]=='' or $bqr[sonclass]=='|') //判断是否存在子栏目   另外加一句判断。坑爹的帝国cms，有时候会莫名其妙的把终极栏目记录了一个值“|”
{
        ?><li><a href="<?=$bqsr[classurl]?>" ><?=$bqr[classname]?></a></li><?php
        }
else
        {
?>
  <li class="menu"><a href="<?=$bqsr[classurl]?>" ><?=$bqr[classname]?></a>
  <ul class="sub">
   
      <?php       
    $newsclass=$empire->query("select classid,classname from ".$dbtbpre."enewsclass where bclassid=".$bqr[classid]." order by myorder,classid asc");
while($classr=$empire->fetch($newsclass))
    {
        $classrurl=sys_ReturnBqClassname($classr,9); //取得子栏目地址
        ?><li><a href="<?=$classrurl?>"><?=$classr[classname]?></a></li><?php
}
?>
    </ul></li>
  <?php
}
?>
[/e:loop]
    </ul>
</nav>

方案四： JS判断栏目高亮（此方法简单，适用于多种页面(首页、封面模板、列表模板、内容模板、自定义页面、自定义列表)）

【自定义页面：head.html】代码

 <div class="header">
<div class="navC">
  <ul class="nav box990 f14" id="nav">
    <li><a href="[!--news.url--]" title="首页" target="_self" id="home">首 页</a></li>
    [e:loop={'select classid,classname,classpath from [!db.pre!]enewsclass where bclassid=0 and showclass=0 order by myorder',0,24,0}]
    <li><a id="cid<?=$bqr[classid]?>" href="<?=$public_r[newsurl]?><?=$bqr[classpath]?>" target="_self" ><?=$bqr[classname]?></a></li>
    [/e:loop] 
    <!--<li><a href="http://www.baidu.com/a/" target="_self" id="cid1">A栏目</a></li>-->
  </ul>
</div>
</div>
<!--当是在首页的时候，id=“home”的li高亮显示，也就是首页高亮-->
<script type="text/javascript">
if(document.URL=="http://www.你网站域名.com/"||document.URL=="http://www.你网站域名.com/index.html"){document.getElementById("home").className="chover";}
</script>
<!--end of header-->

【封面、列表、内容或自定义页面】代码：

<!--#include virtual="/head.html"-->
<script type="text/javascript">
var myid = document.getElementById('cid[!--self.classid--]');
myid.className = 'chover';
</script>

【CSS样式表】

<style>
.nav li a:hover,.chover{ background:#DC261C; color:#FFF;}
</style>