如题所述,当出现这样的功能,点击某个链接后,给跳转后的该链接地址添加样式,通过添加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标签链接匹配 特效代码总结(二)的更多相关文章

  1. jQuery旋转木马仿3D效果的图片切换特效代码

    用jQuery实现的一款仿3D效果的图片切换特效代码,类似旋转木马一样,幻灯图片以三维视觉上下滑动切换,效果很酷炫,兼容IE8.360.FireFox.Chrome.Safari.Opera.傲游.搜 ...

  2. Jquery实现手机上下滑屏滑动的特效代码

    要引入两个jquery插件 可以去网上下载 <script src="jquery-1.11.1.min.js"></script><script s ...

  3. jquery 监听所有锚点链接实现平滑移动

    jquery 监听所有锚点链接实现平滑移动,地址栏上不会改变链接地址 //监听所有锚点链接实现平滑移动 $('a[href*=#],area[href*=#]').click(function() { ...

  4. a标签中的label在IE下触发不了a标签的href链接(label标签——解析)

    <a href="http://www.baidu.com/" target="_blank"> <span>百度</span&g ...

  5. 去除a标签链接触摸时产生边框

    排除误解 网络资料说这个属性只用于iOS(iPhone和iPad),其实是错误的,android手机大部分也是支持的,只是显示效果不一样,移动开发并不成熟,更多的还需要大家去实践来辨别真伪- - -w ...

  6. 微信端解决a标签链接 失效的问题

    最近常碰到这个问题就是 在微信端点击a标签链接的时候,第一次正常界面跳转.但是,界面重新跳转回来再次点击a标签的话 .出现 界面不跳转,但是进度条加载完毕,点击多次页面无法跳转. 解决办法 在链接后边 ...

  7. HTML标签 链接 随笔3

    4-1 <a>标签  网页链接 使用<a>标签可实现超链接,它在网页制作中可以说是无处不在,只要有链接的地方,就会有这个标签. 语法: <a href="目标网 ...

  8. [jQuery]循环遍历改变a标签的href

    把info类下面所有的a标签链接后天加"#article". jQuery(document).ready(function($){ $('.info a').each(funct ...

  9. html邮件链接和锚点链接

    锚点链接: 锚点链接: 标记:<a name="XXX"></a> 取读:<a href="#XXX"></a> ...

随机推荐

  1. Powerbuilder编写身份证校验码

    public function boolean of_calc_cardid_verifycode (string as_cardid, ref string as_verifycode); /* 计 ...

  2. mysql grant all on *.* to xxx@'%' 报Access denied for user 'root'@'localhost'

    今日,开发反馈某台mysql服务器无法登陆,解决之后,远程登录后发现用户只能看到information_schema,其他均看不到. 故登录服务器执行: mysql> grant all on ...

  3. J2EE分布式架构及MySQL交流群

    J2EE分布式架构及MySQL交流群:577913057

  4. jQuery Mobile笔记

    1.获取jQuery mobile 文件,访问jQuerymobile网站下载 (貌似使用jquery mobile后,jquery会自动在网页中添加一些class类,第一次知道的我是被吓呆的!!) ...

  5. 2015年第2本(英文第1本):《The Practice of Programming》

    2015年计划透析10本英文原著,最开始选定的第一本英文书是<Who Moved my Cheese>,可是这本书实在是太短.太简单了,总体的意思就是要顺应变化,要跳出自己的舒适区,全文不 ...

  6. Android Java类编写规范+优化建议

    本文仅是我个人在实际开发中习惯的编写方式,当然这种方式也是来自很多官方的推荐,所以在一定程度上是可以被模仿套用的.本文将不定期更新~ 零.指导原则 优先保证可读性,不要过分追求代码艺术和效率 在可读性 ...

  7. Android Studio 项目代码全部消失--出现原因及解决方法

    出现原因,自己把项目地址父层目录文件名修改了,导致原来打开的项目位置不对,代码全部消失.这样就只要关闭项目,打开一下你修改路径下的项目即可.因为原来的项目还在原来的路径下寻找,但是原来的路径发生了改变

  8. Lucene总体架构

    Lucene总的来说是:• 一个高效的,可扩展的,全文检索库.• 全部用Java实现,无须配置.• 仅支持纯文本文件的索引(Indexing)和搜索(Search).• 不负责由其他格式的文件抽取纯文 ...

  9. Android ListView用EditText实现搜索功能

    前言 最近在开发一个IM项目的时候有一个需求就是,好友搜索功能.即在EditText中输入好友名字,ListView列表中动态展示刷选的好友列表.我把这个功能抽取出来了,先贴一下效果图: 分析 在查阅 ...

  10. App开发流程之Xcode配置和本地化

    补充一点遗漏的Xcode配置. 1.偏好设置.Xcode的菜单栏Xcode -> Preference Fonts & Colors可以自定义编码区和控制台的背景.字体. Text Ed ...