位置: 编程技术 - 正文

jQuery实现导航高亮的方法【附demo源码下载】(js设置导航固定)

编辑:rootadmin

推荐整理分享jQuery实现导航高亮的方法【附demo源码下载】(js设置导航固定),希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:js设置导航固定,jquery实现导航栏,jquery 导航,jquery制作左导航特效,javascript导航栏,jq导航栏显示内容,jquery实现导航栏,jquery实现导航栏,内容如对您有帮助,希望把文章链接给更多的朋友!

本文实例讲述了jQuery实现导航高亮的方法。分享给大家供大家参考,具体如下:

导航是我们页面中一般都需要的一个元素,它可以说是一个站点必用的元素,没有了导航,会让人找不着北,但有时候,仅仅有了导航还不够,还需要在当前的页面中标明当前是在哪一个类别里面,这时候就有了不同的实现的方法,也就有了下文的一些介绍。

通常,我们在做导航的时候,都是由程序直接输出当前的页面的的高亮状态的样式,我们只需要定义好输出的类的高亮的样式就可以了,这样是最直接有效也是最常用的方法。

像Wordpress的导航输出,会自动输出一个高亮的类的“current”,如下图:

但有时候,我们在程序里进行包含的文件的时候,如统一的头部和底部,这时候统一的头部中有一个这样的导航,如果粗心的程序员没有无法给目前所在的目录或文件输出一个高亮的类的时候,或者有时候实现起来非常麻烦的时候,能不能有一些其实的方法来实现和补救呢?

答案是肯定的,那就是JS。

但这个根据怎样的规则给当前的这个目录或文件实现高亮呢?

jQuery实现导航高亮的方法【附demo源码下载】(js设置导航固定)

最近刚好也在项目中遇到这个问题,所以通过一番的折腾,实现了效果。

我的思路是这样的,先找到当前的URL的路径,然后URL中的最后的一个文件名或目录和导航中元素的某个属性来进行匹配,匹配成功的就加上高亮的类,把别的不是当前匹配的类的高亮样式去掉,不成功的时候就返回到首页这个来进行高亮。

于是就有了下面的代码,经试验,无论是文件或是目录都可匹配成功:

THML:

js代码:

不要忘了,该脚本是基于Jquery的。

完整实例代码点击此处本站下载。

更多关于jQuery相关内容感兴趣的读者可查看本站专题:《jQuery窗口操作技巧总结》、《jQuery拖拽特效与技巧总结》、《jQuery常用插件及用法总结》、《jquery中Ajax用法总结》、《jQuery表格(table)操作技巧汇总》、《jQuery扩展技巧总结》、《jQuery常见经典特效汇总》、《jQuery动画与特效用法总结》及《jquery选择器用法总结》

希望本文所述对大家jQuery程序设计有所帮助。

jQuery EasyUI中的日期控件DateBox修改方法 jQueryEasyUI中的日期控件DateBox很好用的,首先需要引入jquery文件,代码如下:!DOCTYPEhtmlhtmlheadmetacharset="UTF-8"titleBasicDateBox-jQueryEasyUIDemo/titlelinkrel="stylesheet"t

easyui datagrid 大数据加载效率慢,优化解决方法(推荐) 在使用easyuidatagrid途中发现加载数据的效率真的不是一般的差。经测试IE8加载条数据就感觉明显的慢了,加载条数据就另人崩溃用时差不多秒,就

浅谈EasyUI常用控件的禁用方法 如下所示:input和textarea:$('#controlid').prop('disabled',true);$('input:not(:button,:hidden)').prop('disabled',true);//禁用除button和hidden控件外的所有input控件$('textarea').prop(

标签: js设置导航固定

本文链接地址:https://www.jiuchutong.com/biancheng/377794.html 转载请保留说明!

上一篇:jquery获取easyui日期控件的值实现方法(jquery easy ui)

下一篇:jQuery EasyUI中的日期控件DateBox修改方法(jquery easyui插件)

  • 股东撤资涉及到哪些税如何缴纳?
  • 如何成为一般纳税人的条件
  • 银行的记账凭证怎么做
  • 担保费能否开专票
  • 现金日记账本月合计的红线画法
  • 销项税额是不是开出去的发票金额
  • 深圳增值税发票选择确认平台使用
  • 经营活动现金流增加的原因
  • 发生销售折让可以不开具
  • 网上申报增值税怎么操作
  • 音乐茶座取什么名字好呢
  • 债权投资的账务处理步骤
  • 一次性伤残就业赔偿标准
  • 支付股东借款利息怎么交税
  • 收到展会补贴账务处理
  • 从原材料到库存商品的生产核算过程
  • 企业员工已公司名义参加境外比赛获得奖金如何缴税?
  • 增值税普票销售方无开户行账号是否可以
  • 银行账户设置数大于纳税人向税务机关提供数
  • 代建项目增值税税率
  • 劳保用品计入福利费嘛
  • 预收账款的科目属性
  • 增值税多交了怎么申请退税
  • 专家费怎么做账没发票
  • 企业所得税法中规定的收入总额包括
  • 企业支付微信认证怎么弄
  • 企业所得税汇算清缴补缴税款分录
  • 关闭密码保护共享后又自动开启
  • apache运行php
  • 安保服务差额征税如何开票
  • 工人工资怎么算
  • 不需要认证的进项税额怎么处理
  • 购入材料会计分录怎么写
  • php跨域解决方案
  • ctfmon.exe文件在哪
  • 【2023亲测可用】JS 获取电脑本地IP 和 电脑网络IP(外网IP|公网IP)
  • linux搭建web服务器
  • idea如何运行springboot项目
  • 上市公司回购股票意味着什么
  • 六自由度机器人简图
  • 国税系统怎么认证发票
  • php公众号推送完整示例
  • 软件开发增值税减免政策
  • 企业所得税应该怎么计算
  • 哪些合同必须签订书面合同
  • 在vue项目如何引入异步组件?
  • Shading-JDBC、ShadingSphere、ShardingProxy 使用详解
  • 公司购买办公楼需要缴纳城镇土地使用税吗
  • 新公司申请一般纳税人流程
  • 进项税多记了怎么调账
  • 小规模第一次申报流程
  • 城镇土地使用税税率
  • 保险理赔进项税额转出
  • 培训学校不退学费找什么部门
  • 应收账款期初余额在借方还是贷方
  • 汇算清缴前跨年调账怎么调
  • 公司代缴社保生育津贴大概领多少
  • 生产企业出口退税政策
  • 企业转让固定资产企业所得税
  • 小规模纳税人交通运输服务税率
  • 如何启动vmware authorization service
  • xp系统怎么删除系统
  • amd furyx
  • 七喜r11c笔记本
  • windows地图导航
  • 中文版windows7的安装方式
  • spkrmon.exe - spkrmon是什么进程
  • linux中bc命令
  • win8开始界面如何设置成win7
  • mac2019强制关机
  • win7无线wifi
  • python解读
  • android toast位置
  • android退出功能
  • python写一个复制文件的程序
  • jquery全选和全不选效果
  • js new实现
  • 电子税务局如何申报社保
  • 怎么查询手机发票
  • 怎么登录吉林省公务员网络培训学院
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设