jquery 当前页导航高亮显示
<script type="text/javascript"> $(document).ready(function(){
var myNav = $("#nav a"),i; for(i=0;i<myNav.length;i++){ var links =myNav.eq(i).attr("href"),myURL =document.URL; if(myURL.indexOf(links) != -1) { myNav.eq(i).parent().addClass("current"); }
}
});
</script>
js代码
html部分
<div id="nav" >
<ul >
<li ><a href=" ">主页</a></li>
<li><a href=" ">今日热点</a></li>
<li><a href=" ">当地新闻</a></li>
</ul>
</div>
css部分
#nav ul li.current {
background: transparent url(../images/left-tab.gif) no-repeat;
}
#nav ul li.current a {
color: #444;
background: transparent url(../images/right-tab.gif) no-repeat right top;
}
其实本身不是很难,主要对jQuery对象方法和属性有深入了解。留意jQuery对象小括号
jquery 当前页导航高亮显示的更多相关文章
- 分享21个基于jquery菜单导航的效果
jquery导航菜单插件制作jquery动画菜单熔岩灯菜单效果更新时间:02月15日 14:53:03 虾米精选-菜单导航-导航菜单 0浏览 / ★★★☆☆星级 / 未知软件大小/ jquery导航菜 ...
- jQuery Mobile 导航栏
jQuery Mobile 导航栏 导航栏由一组水平排列的链接构成,通常位于页眉或页脚内部. 默认地,导航栏中的链接会自动转换为按钮(无需 data-role="button"). ...
- dede使用方法---用js让当前导航高亮显示
当前导航高亮显示能够提升用户体验,我也知道,大家在网上搜dede让当前导航高亮显示的方法一抓一大把,但是,并不一定适合自己的需求.就像我的需求一样,导航有个二级导航,然后需要做到让当前导航高亮显示.我 ...
- jQuery弹性滑动导航菜单实现思路及代码
<!DOCTYPE HTML> <html> <head> <meta charset="UTF-8" /> <meta na ...
- jQuery 顶部导航尾随滚动,固定浮动在顶部
jQuery 顶部导航尾随滚动.固定浮动在顶部 演示 XML/HTML Code <section> <article class="left"> < ...
- 30个实用的jQuery选项卡/导航教程推荐
很多网站设计中都使用了选项卡(tabs),在制作选项卡时应用jQuery能够实现很多炫酷的过渡和动画效果.本文为你介绍30个实用的jQuery选项卡教程,希望对你有帮助. 1. Animated Ta ...
- jQuery实现导航栏
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 简单的jquery左侧导航栏和页面选中
这里是要实现导航的左侧并选中的,此功能需引用jquery 左侧导航: <div class="box"> <ul class="menu"&g ...
- 10款最新CSS3/jQuery菜单导航插件
这是我们在2014年收集的10款最新的CSS3 / jQuery菜单导航插件,不论从外观样式,还是功能扩展性,这些jQuery菜单一定可以满足大家的设计需求.这次我们收集的jQuery菜单,有水平 菜 ...
随机推荐
- Minimum Size Subarray Sum —— LeetCode
Given an array of n positive integers and a positive integer s, find the minimal length of a subarra ...
- [Locked] Zigzag Iterator
Zigzag Iterator Given two 1d vectors, implement an iterator to return their elements alternately. Fo ...
- angularJS 过滤器 表单验证
过滤器1.filter的作用就是接收一个输入,通过某个规则进行处理,然后返回处理后的结果,主要用于数据的格式化.2.内置过滤器(1)Currency(货币)将一个数值格式化为货币格式,默认为$(2)D ...
- Spring task任务调度详解
spring内部有一个task是Spring自带的一个设定时间自动任务调度 task使用的时候很方便,但是他能做的东西不如quartz那么的多! 可以使用注解和配置两种方式,配置的方式如下 引入Spr ...
- 10个经典的Java面试题
这里有10个经典的Java面试题,也为大家列出了答案.这是Java开发人员面试经常容易遇到的问题,相信你了解和掌握之后一定会有所提高.让我们一起来看看吧. 1.Java的HashMap是如何工作的? ...
- ab测试
PS:网站性能压力测试是性能调优过程中必不可少的一环.只有让服务器处在高压情况下才能真正体现出各种设置所暴露的问题.Apache中有个自带的,名为ab的程序,可以对Apache或其它类型的服务器进行网 ...
- nvl,空时的推断和取值
nvl NVL的概念 Oracle/PLSQL中的一个函数. 格式为: NVL( string1, replace_with) 功能:假设string1为NULL,则NVL函数返回replace_wi ...
- 改写URL的查询字符串QUERY_STRING(转)
查询字符串是指URL请求中“问号”后面的部分.比如,http://www.nowamagic.net/?foo=bar中粗体部分就是查询字符串,其中变量名是foo,值是bar. 1. 利用QSA转换查 ...
- staticMetaObject
staticMetaObject : QObject 及其 子类 的静态属性成员. 定义如下: const QMetaObject staticMetaObject; QMetaObject 记录了 ...
- Android系统移植与驱动开发——第七章——LED驱动
LED驱动的实现原理 编写LED驱动: 测试LED驱动之前需要用USB数据线连接开发板,然后打开电源,成功启动之后,执行build.sh脚本文件编译和安装LED驱动,顺利则会自动连接 如果有多个设备文 ...