jquery 地址栏链接与a标签链接匹配 特效代码总结(二)
如题所述,当出现这样的功能,点击某个链接后,给跳转后的该链接地址添加样式,通过添加class为current来增加特殊样式。
如图所示:点击HTML+css3跳转后,给其添加如图样式:

js代码如下:
var currUrl = window.location.href;
var currStyle = function (links){
links.each(function(){
var url = $(this).attr('href');
if (currUrl.indexOf(url) != -1){
$(this).addClass("current");
return false;
}
});
}
怎样调用呢?如下jquery调用代码:
$(function(){
currStyle($("#sidebar .list a"));
})
这样就实现了如图所示的功能。
jquery 地址栏链接与a标签链接匹配 特效代码总结(二)的更多相关文章
- jQuery旋转木马仿3D效果的图片切换特效代码
用jQuery实现的一款仿3D效果的图片切换特效代码,类似旋转木马一样,幻灯图片以三维视觉上下滑动切换,效果很酷炫,兼容IE8.360.FireFox.Chrome.Safari.Opera.傲游.搜 ...
- Jquery实现手机上下滑屏滑动的特效代码
要引入两个jquery插件 可以去网上下载 <script src="jquery-1.11.1.min.js"></script><script s ...
- jquery 监听所有锚点链接实现平滑移动
jquery 监听所有锚点链接实现平滑移动,地址栏上不会改变链接地址 //监听所有锚点链接实现平滑移动 $('a[href*=#],area[href*=#]').click(function() { ...
- a标签中的label在IE下触发不了a标签的href链接(label标签——解析)
<a href="http://www.baidu.com/" target="_blank"> <span>百度</span&g ...
- 去除a标签链接触摸时产生边框
排除误解 网络资料说这个属性只用于iOS(iPhone和iPad),其实是错误的,android手机大部分也是支持的,只是显示效果不一样,移动开发并不成熟,更多的还需要大家去实践来辨别真伪- - -w ...
- 微信端解决a标签链接 失效的问题
最近常碰到这个问题就是 在微信端点击a标签链接的时候,第一次正常界面跳转.但是,界面重新跳转回来再次点击a标签的话 .出现 界面不跳转,但是进度条加载完毕,点击多次页面无法跳转. 解决办法 在链接后边 ...
- HTML标签 链接 随笔3
4-1 <a>标签 网页链接 使用<a>标签可实现超链接,它在网页制作中可以说是无处不在,只要有链接的地方,就会有这个标签. 语法: <a href="目标网 ...
- [jQuery]循环遍历改变a标签的href
把info类下面所有的a标签链接后天加"#article". jQuery(document).ready(function($){ $('.info a').each(funct ...
- html邮件链接和锚点链接
锚点链接: 锚点链接: 标记:<a name="XXX"></a> 取读:<a href="#XXX"></a> ...
随机推荐
- C# on Visual Studio Code
installation Download .NET Core SDK installer and install it. https://www.microsoft.com/net/download ...
- java LinkedBlockingQueue和ConcurrentLinkedQueue的区别
实现上看,两者都继承于AbstractQueue,但是ConcurrentLinkedQueue实现了Queue,而LinkedBlockingQueue实现了BlockingQueue,Blocki ...
- dapper的增、删、查改的CodeSmith模板
<%@ Template Language="C#" TargetLanguage="Text" %> <%@ Property Name=& ...
- 【GOF23设计模式】模板方法模式
来源:http://www.bjsxt.com/ 一.[GOF23设计模式]_模板方法模式.钩子函数.方法回调.好莱坞原则 package com.test.templateMethod; publi ...
- A除以B问题
描述:本题要求计算A/B,其中A是不超过1000位的正整数,B是1位正整数.你需要输出商数Q和余数R,使得A = B * Q + R成立. 输入:输入在1行中依次给出A和B,中间以1空格分隔. 输出: ...
- viewport的一些事
整理了下viewport的东西,用脑图画了下
- 关于一个js连续赋值问题之我见(词略穷,见谅)
前几天在搜索面试题时发现了这么一段代码,执行完后感觉完全不与所想的一样 var a = { n : 1 }; var b = a; a.x = a = {n : 2}; console.log(a.x ...
- 使用div创建选取框
使用div实现了选取框效果. 代码如下 <!DOCTYPE html> <html> <head> <title>myCanvasTest</ti ...
- SQL Server join介绍
介绍Inner Join(可以省略Inner,平常经常inner,就是inner join), Full Out Join,Cross Join,Left Join, Right Join区别. )) ...
- ABAP中正则表达式的简单使用方法 (转老白BLOG)
在一个论坛上面看到有人在问正则表达式的问题,特举例简单说明一下.另外,REPLACE也支持REGEX关键字.最后:只能是ECC6或者更高版本才可以(ABAP supports POSIX regula ...