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="/";
}
/*去除g=Portal*/
//判断URL模式
if( preg_match ( '/php\?g=/' , $href ) ){
$href = preg_replace ( '/g=Portal\&/' , '' , $href );
}else{
$href = preg_replace ( '/Portal\//' , '' , $href );
}
/*转化为小写*/
$href = strtolower($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>
thinkcmf 导航高亮制作方法(适用于多级导航)(通用)的更多相关文章
- thinkphp导航高亮的方法
因为引入了公共的 header.html,所以需要使用 js来实现向 li 加入active的高亮属性,这里我通过url地址和href的地址进行判断 // 这里对当前页面导航高亮 $(function ...
- thinkphp实现导航高亮的简单方法
经常会涉及到关于导航菜单高亮显示的问题,大多是通过配合js或者事先分配变量的方式来实现导航高亮的,这里提供另一种思路参考: <ul class="usermenu"> ...
- JS原生代码实现导航高亮
一 实现原理 根据当前页面滚动条的高度判断当前页面应当与导航栏中哪个导航相关联,并对相应的导航设置高亮样式. 二 代码解析 先简单写一个页面顶端的导航栏:<nav> <ul> ...
- vue使用原生js实现滚动页面跟踪导航高亮
需要使用vue做一个专题页面. 滚动页面指定区域导航高亮. BetterScroll:可能是目前最好用的移动端滚动插件 如何自定义CSS滚动条的样式? 监听滚动页面事件,对比当前页面的位置与元素的位置 ...
- 讲解版的导航高亮(新手福利)原生JS
1.先写样式: 导航的排版样式: 导航对应高亮样式: .d6000f{ background:red; } .d6000f a{ color:#fff; } 我这个地方导航高亮样式为背景红色,字体颜色 ...
- 学习使用 CSS3 制作网站面包屑导航效果
作为最重要的导航展示形式之一,面包屑导航能够让用户更清楚的知道他们所在页面的层次结构,让他们可以方便的导航到上一层页面.在本教程中,您将学习如何使用 CSS3 技术创建自己的面包屑导航效果. 效果演示 ...
- 使用css3和伪元素制作的一个立体导航条
使用css3和伪元素制作的一个立体导航条供大家参考,代码如下: <!doctype html> <html lang="en"> <head> ...
- js手机对应的多级导航分享
js移动导航对应,您可以使用自适应时屏幕,当小画面在一定程度上的网站.使导航出现,The navigation effects such as the following figures:多级导航! ...
- Android (争取做到)最全的底部导航栏实现方法
本文(争取做到)Android 最全的底部导航栏实现方法. 现在写了4个主要方法. 还有一些个人感觉不完全切题的方法也会简单介绍一下. 方法一. ViewPager + List<View> ...
随机推荐
- vue基础知识总结
vue不支持安卓6.0以下版本,切记!!! 1.创建vue实例 var vm = new Vue({ el: '#app', //所指向的dom的id data:{ }, //与dom元素绑定的数据 ...
- C++ 字符串、string、char *、char[]、const char*的转换和区别
1.字符串 字符串本质就是一串字符,在C++中大家想到字符串往往第一反应是std::string(后面简称string) 字符串得从C语言说起,string其实是个类,C语言是没有class的,所以C ...
- codeforces 1131D-Gourmet choice
传送门:QAQQAQ 题意:有两个数组,一个数组有n个数,另一个数组有m个数.s[i][j]表示第一个数组第i个数和第二个数组第j个数的大小关系,要求构造出一种方案,使条件成立. 先考虑没有等于号的情 ...
- DOS批处理脚本
先概述一下批处理是个什么东东.批处理的定义,至今我也没能给出一个合适的----众多高手们也都没给出----反正我不知道----看了我也不一定信服----我是个菜鸟,当然就更不用说了:但我想总结出一个“ ...
- 2019-2-18-VisualStudio-给项目添加特殊的-Nuget-的链接
title author date CreateTime categories VisualStudio 给项目添加特殊的 Nuget 的链接 lindexi 2019-02-18 15:56:48 ...
- Spring 调度工具Quartz cron 表达式的格式
http://chinaxxren.iteye.com/blog/839630 Quartz cron 表达式的格式十分类似于 UNIX cron 格式,但还是有少许明显的区别.区别之一就是 Quar ...
- create-react-app 创建项目失败
创建失败后查阅相关资料,亲测删除 C:\Users\Administrator\AppData\Roaming\npm-cache\ 该文件夹下所有内容后成功.
- 让pandoc输出pdf时支持中文
主机环境为:Ubuntu 12.04 LTS.对于RH系列,yum安装包的名称可能会有不同,不过yum联想能力比较强,应该不是问题. 安装pandoc,安装tex-live sudo apt-get ...
- 软件-MQ-MQ:IBM MQ
ylbtech-软件-MQ-MQ:MQ(IBM MQ) MQ传递主干,在世界屡获殊荣. 它帮您搭建企业服务总线(ESB)的基础传输层.IBM WebSphere MQ为SOA提供可靠的消息传递.它为经 ...
- MyBatis配置文件(一)――properties属性
MyBatis配置文件中有很多配置项,这些配置项分别代表什么,有什么作用,需要理一下了.先通过下面这个例子来看都有哪些配置项 <?xml version="1.0" enco ...