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菜单,有水平 菜 ...
随机推荐
- 高效算法——Most financial institutions 贪心 H
H - 贪心 Crawling in process... Crawling failed Time Limit:3000MS Memory Limit:0KB 64bit IO Fo ...
- 行为树(Behavior Tree)实践(1)– 基本概念
原文地址:http://www.360doc.com/content/15/0107/11/15099545_438831036.shtml 自从开博以来,每天都会关心一下博客的访问情况,看到一些朋友 ...
- floyd详解
就不在来回搬了 请看 http://note.youdao.com/groupshare/?token=6422E952998F4381A1534B71359EFA57&gid=1579165 ...
- 第一节:Scrapy开源框架初探
Scrapy是一个为了爬取网站数据,提取结构性数据而编写的应用框架. 可以应用在包括数据挖掘,信息处理或存储历史数据等一系列的程序中. 具体开发流程如下: 一.确定待抓取网站 当您需要从某 ...
- .net core4
- ios解析XML和json数据
解析的基本概念所谓“解析”:从事先规定好的格式串中提取数据解析的前提:提前约定好格式.数据提供方按照格式提供数据.数据获取方按照格式获取数据iOS开发常见的解析:XML解析.JSON解析 一.XML数 ...
- NYOJ 491 幸运三角形
幸运三角形 import java.util.Scanner; public class Main{//搜索 static int sum=0,n; public static void main(S ...
- Ubuntu12.04安装hadoop
1. 创建hadoop用户组和用户 a. 创建hadoop用户组 sudo addgroup hadoop b. 创建hadoop用户 sudo adduser –ingroup had ...
- Visual studio 2008 的语法高亮插件 NShader
前段时间一直在使用matlab,今天需要使用vs2008,而用惯了matlab,习惯了其中一项选中变量高亮的设置,突然回来使用VS,感到各种不适应,顿时想到了一个词:矫情 呵呵,于是在网上找各种插件, ...
- [ES6] Array.find()
Convenient method to find one item in an array, avoid writing and for + if: let arys = [1,,5,,6] ; ...