导航中当前页的活动状态

<style>.active{color:#f00;font-weight: bold;}</style>
<div id="nav">
	<a href="/aaa/aaa.html">aaa</a>
	<a href="/bbb/bbb.html">bbb</a>
	<a href="/ccc/ccc.html">ccc</a>
	<a href="/ddd/ddd.html">ddd</a>
	<a href="/eee/eee.html">eee</a>
	<a href="/fff/fff.html">fff</a>
	<a href="/ggg/ggg.html">ggg</a>
</div>

<script type="text/javascript" src="http://js.ql91.cn/ql91com/ql91/jquery.js"></script>

<script>
var pathname = window.location.pathname;  //这个获取当前的页面path
pathname = "/fff/fff.html";  //当前页面的path   测试用的,实际使用是注释这一行

$.each($("#nav a"),function(k,v){
    var href = $(v).attr("href");  //获取导航上的每个连接的url
    if(href.indexOf(pathname)!=-1){   //查看当前页面是否在pathname中存在
        $(v).addClass(‘active‘); //如果存在就叫上活跃的CSS
    }
});
 </script>
时间: 2024-10-22 06:45:14

导航中当前页的活动状态的相关文章

Android Design 1: Back键和Up键在App导航中的表现

一,概念 1, Back键一直存在android系统中 1-1 任何页面下的返回 1-2 Floating window 1-3 Contexual Action bar/highlight select 1-4 Keyboard 2, Up键是随Android Design出来的. 2-1 android Design 定义的parent container 2-2 app的主界面是不存在Up键的 二,情景分析 1, App内部 1-1 沿逐级深入路径 Back:按照activity在栈中的顺

如何删除帝国cms面包屑导航中首页链接的/index.html

前面一篇"帝国cms面包屑导航的首页链接锚文本改成关键字"中xmyanke有写到改首页链接的方法,但是感觉比较麻烦,这里就说说如何删除帝国cms面包屑导航中首页链接的/index.html,我们的首页一般都是***.com/结尾的,如果Breadcrumb的中首页链接变成***.com/index.html结尾的话,会造成有两个首页,分散权重.重复收录.(当然可以把index.html 301到不带index.html) 找到e/class/connect.php,搜索$file=$p

Bootstrap历练实例:导航中的表单

Bootstrap历练实例:导航中的表单,它是使用class.navbar-form类,这确保了表单适当的垂直对齐和在较窄的视口中折叠的行为,使用这个对齐方式选项来决定导航栏中的内容放置在哪里. 实例: <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title>

(ros/navigation) navigation导航中一些重要话题的来源和去路

(ros/navigation) navigation导航中一些重要话题的来源和去路,对理解程序有很大帮助 topic1:  cmd_vel Type: geometry_msgs/Twist Publishers: * /move_base Subscribers: * none topic2:  /move_base/NavfnROS/plan Type: nav_msgs/Path Publishers: * /move_base Subscribers: * /rviz topic3: 

对动态导航进行当前页面的标识的解决办法

在ASPCMS中,一个栏目下子分类的导航显示是以这样的方式展现: 动态生成,我们无法直接对明确的指向当前页面li元素添加值为"currclass"的class属性. 这里我有两种解决方式: 在参考对比原始模板后发现,可以在<li>标签里根据页面类型的sort添加动态判断语句,如图: OK,可以在浏览器中看到: 另一种方法使用Javascript,最近在看经典的<javascript dom 编程艺术>,其中对此提出过解决方法,主要是对比a标签的href属性值与当

导航中的中英文切换

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-

Android 推断程序在手机中是否是活动状态或者正在执行状态

沈阳斌子在今天项目需求上碰到个这种问题,在Service中须要推断当前的程序是否是活动状态,换句话说也就是说后台跑的服务中有业务需求检測当前程序是否是该服务的程序 这样好让点击推送通知时跳转到不同的页面进行不同的操作. 以下就粘贴出我封装了一下的方法和大家共享. /** * * @Description : 这个包名的程序是否在执行 * @Method_Name : isRunningApp * @param context 上下文 * @param packageName 推断程序的包名 *

Android 判断程序在手机中是否是活动状态或者正在运行状态

沈阳斌子在今天项目需求上碰到个这样的问题,在Service中需要判断当前的程序是否是活动状态,换句话说也就是说后台跑的服务中有业务需求检测当前程序是否是该服务的程序 这样好让点击推送通知时跳转到不同的页面进行不同的操作.下面就粘贴出我封装了一下的方法和大家共享. /** * * @Description : 这个包名的程序是否在运行 * @Method_Name : isRunningApp * @param context 上下文 * @param packageName 判断程序的包名 *

导航中一级导航和二级导航之间的切换

<h3>学籍系统</h3> <ul> <li><a href="/Student/LeaveList.aspx">请假信息</a></li> </ul> <h3>实验管理系统</h3> <ul> <li><a href="/Student/Laboratory/LeaveList.aspx">借出设备</a