thinkcmf 导航高亮制作方法(适用于多级导航)(通用)

平时用thinkcmf网站开发经常需要导航点击之后高亮,就写了一些实现方法分享一下。

思路很简单,先获取当前页面的顶级栏目的地址,然后与导航中的地址比较,相同的就加上一个class,把下面函数理解了不管一级、二级、三级都能做。

1、添加函数

/*获取当前栏目的顶级栏目地址适用2级栏目*/
function get_top_url($c,$id){
    $arr[‘href‘][‘action‘]="Portal/".$c."/index";
    $arr[‘href‘][‘param‘][‘id‘]=$id;
    $nav=M(‘nav‘);
    $rs=$nav->select();
    foreach($rs as $k=>$v){
         $rs[$k][‘href‘]=unserialize(stripslashes($v[‘href‘]));
     }
    foreach($rs as $k=>$v){
        if($v[‘href‘]==$arr[‘href‘]){
            $a=$v;
        }
    }
    if($a[‘parentid‘]==0){
        $href=$a[‘href‘];
    }else{
        $id=$a[‘parentid‘];
        $result=$nav->find($id);
        $href=unserialize(stripslashes($result[‘href‘]));
    }
   if($href){
           $href=leuu($href[‘action‘],array(‘id‘=>$href[‘param‘][‘id‘]));
        $default_app=strtolower(C("DEFAULT_MODULE"));
        $g=C("VAR_MODULE");
        $href=preg_replace("/\/$default_app\//", "/",$href);
        $href=preg_replace("/$g=$default_app&/", "",$href);
   }else{
           $href="/";
   }

    return $href;
}

2、模板调用

<php>
    /*获取主导航*/
    $menu=sp_get_menu_tree(1);
    /*获取当前页面的顶级栏目的地址*/
    if(CONTROLLER_NAME=="Article"){
        $url=get_top_url("List",$term_id);
    }else{
        $url=get_top_url(CONTROLLER_NAME,$_GET[‘id‘]);
    }  //上传到服务器时,可删除下面行,为了本地测试所用 http://localhost/gupiao/  //$url = ‘/gupiao‘ . $url;
</php>
<volist name="menu" id="vo" key="k">
  /*判断当前页面的顶级栏目的地址$url与导航中的链接$vo["href"]是否一样*/
      <li  class="n1 <eq name=‘url‘ value=‘$vo["href"]‘>selected_u</eq>">
           <a href="{$vo[‘href‘]}" target="{$vo[‘target‘]}">{$vo[‘label‘]}</a>
         <notempty name="vo[‘child‘]">
           <ul class="navMoreUL">
              <volist name="vo[‘child‘]" id="v">
                   <li><a href="{$v[‘href‘]}" target="{$v[‘target‘]}">{$v[‘label‘]}</a></li>
               </volist>
           </ul>
       </notempty>
       </li>
</volist>
 

摘自:http://www.zhlblog.com/article/29.html

时间: 2024-11-10 11:23:38

thinkcmf 导航高亮制作方法(适用于多级导航)(通用)的相关文章

js手机相应式多级导航分享

js手机相应导航,可以在自适应屏幕的时候运用,当网站屏幕小到一定程度是,让该导航出现,该导航效果如下图:多级导航! 主要的设计思路是:在菜单中往往会有很多内容或者有多个层次的子菜单,为了更加简洁和节省空间,在这个下拉菜单中将每个子菜单都隐藏在一个主导航按钮下方,当点击的时候通过细微的动画显示出来:当再次点击层级菜单时,可以再次以不同形式的动画展示下一级菜单.因为此菜单是流体布局的,所以可以很容易的适应于响应式布局当中. html代码: <div id="dl-menu" clas

JS原生代码实现导航高亮

一 实现原理 根据当前页面滚动条的高度判断当前页面应当与导航栏中哪个导航相关联,并对相应的导航设置高亮样式. 二 代码解析 先简单写一个页面顶端的导航栏:<nav>  <ul>    <li><a class="nav active" href="#nav1">导航1</a></li>    <li><a class="nav" href="#na

Axure8视频教程_Axure8高保真原型:Web导航设计制作

Axure8高保真原型:Web导航设计制作课程观看地址:http://www.xuetuwuyou.com/course/248课程出自学途无忧网:http://www.xuetuwuyou.com 课程介绍 适用人群产品经理.交互设计师.用户体验设计师.产品设计.视觉设计师 课程目标独立制作Web产品的高保真原型 学习后可以迅速投入进工作,掌握产品经理.交互设计师.用户体验设计师.产品设计.视觉设计师等职位的基本技能. 课程概述米草网的Axure课程已由Axure官方认证,请学员放心学习. 本

[UI组件基础] 制作一个带有底部导航以及顶部导航的single view application

最近开始写博客了,把我学习到的东西进行汇总和总结. 很多初学iOS手机应用程序开发的刚开始肯定是抓头的,搞不好,是大片大片的头发往下扯. 因为很迷茫啊,都不知道要怎么弄,有真机有大神帮忙的人还好说,没有机器又没有朋友的人就惨了,完全不知道从何开始. 其实我觉得把,如果是真想学,最次最次,你最少弄个XCode用用看. 前期如果没有XCode,没有苹果电脑,也可以先从基础语法开始学起,其实oc语法也很蛋疼的,什么*啊,alloc啊init啊.估计跟大家想象的世界完全不同,学了java的人再来看oc,

水平导航栏制作

在网页中水平导航栏是每一张网页都有的. 现在做一个简单的导航栏: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head> <meta content="text/html" charset="utf-8">

在项目中运用到的导航高亮

不废话,直接贴代码,毕竟是简单的导航高亮,几乎所有人都能看懂 (function($, w, d) { function nav(name, className) { var url = window.location.pathname + window.location.search; //获取URL路径地址与URL Get传参之后的地址 var v1 = ""; if (url.indexOf("About/media") != -1) {//判断URL中是否存

基于jQuery垂直多级导航菜单代码

基于jQuery垂直多级导航菜单代码是一款黑色风格的jQuery竖直导航菜单特效下载.效果图如下: 在线预览   源码下载 实现的代码. html代码: <ul class="ce"> <li> <a class="xz" href="#">目录A</a> </li> <li> <a href="#">目录B <img class=&qu

chrome浏览器默认启动时打开2345导航的解决方法

2345并没有修改chrome内部设置,它只是把所有的快捷方式修改了,包括开始菜单旁边的快捷启动图标. 只需要右键chrome快捷方式,在目标一栏中,把"----chrome.exe"引号后面的所有东西删除,然后确定,就不会再有问题了.开始菜单旁边的小chrome图标一样方法都可以解决... 而若在更改目标位置时出现需要一"您的权限不足,请点击继续来获得权限." 解决方法: 对计算机图标,击右键,选择管理. 开界面后,选择本地用户和组,单击用户,选择administ

多级导航菜单

<html> <head> <title>树状列表结构测试</title> <style type="text/css"> * { margin:0; padding:0; border:0; } body { font:12px/130% verdana, geneva, arial, helvetica, sans-serif, 宋体; } li { list-style:none; } .clearfix:after {