在zblog官方文档里面看到的这个,个人拿来使用了下,觉得效果还可以,借花献佛:
让导航突出显示当前页链接条目我们的大致思路是这样的,首先用js给导航部分中当前链接项加个区分的ID,如<li id=“current”>首页</li>,然后再用CSS定义就完成了。
步骤如下:
1、将以下代码放置在网站导航代码的后面。修改pageNav为你正在使用的主题导航栏的id名称。
<script type="text/javascript"> $("#pageNav>ul>li>a").each(function() { if ($(this).attr("href").toLowerCase().replace(/\/|[&#].*/g,"") == document.URL.toLowerCase().replace(/\/|[&#].*/g,"")){ $(this).attr("class","current"); //给当前页的<a>加上class="current",如<a class="current">首页</a> } }); </script>
2、将以下css代码放置在正在使用的主题的css文件里面,可以根据实际情况修改css
#menu ul li a.current { background-color:#fff; color:#0B1316; }
好了,文件重建下看看效果。
本站已经使用了这段代码,大家可以参考看看,不过我发现了一个问题,貌似这个效果只在栏目页有效,在内容页没有效果,不晓得是为什么,正在研究在,研究出来了也会发出来的。
相关推荐
- zblog应用中心如何开发票?在zblog应用中心购买应用后开发票流程11-29
- 天兴工作室zblog导航单页插件:每个站长,都需要一个专属导航页!04-26
- zblog内置的cookie调用代码06-19
- 2020年 zblog1.6版本终于上线了03-26
- 怎样让zblog网站的速度变快?05-24
- zblog+宝塔面板设置404的方法05-15
- 终于...zblog导航栏管理插件出来了!11-02
- zblog增加了xss安全更新 如果报错请及时更新文件07-18
- 天兴工作室zblog模板-第一款mip主题!05-08
- zblog右侧栏最新文章调用数量怎么控制?03-11
欢迎 你 发表评论: 取消回复
- 最新文章
- 热文排行
- 最多评论
- 1zblog登录后台一直提示验证码错误的原因和解决方法03-01
- 2zblog使用api提交post数据提示419错误的原因和解决方法02-23
- 3天兴工作室2025年春节放假公告01-25
- 4天兴用户中心插件“微信通知”功能设置教程11-09
- 5阿里云2024双11活动推荐 通过本站链接参与另外赠送本站代金券11-05
- 6天兴工作室官网购物活动:全场8折优惠券 不限次数不限金额04-17
- 7天兴工作室zblog纯博客主题 vue3+小程序双版本03-19
- 8vue3项目引入vant报错的错误原因和解决办法03-12
- 9天兴工作室zblog百科主题 可搭配会员插件实现知识付费盈利03-06
- 标签聚合
- ×1武汉爱乐×7下拉导航×1zblog主题包×1木马×4错误提示×1一言难尽×4西部数码×1zblogphp1.5错误×1a298t×1购买zblog主题×1电脑端主题×1分类过滤×1注册会员×2Font Awesome×1淘宝搜索代码×1bootstrap框架×1上传文件×3mip×1瀑布流布局模板×4右侧栏
最新评论
-
天兴工作室
并没有任何限制 -
访客
请问 zblog淘客主题 对使用者的要求是必须是企业吧? -
阿浩
大佬们,丢几个除了作者以外的演示站,我想看看大家的布局设置 -
有趣生活
一直想开发zblog的功能,zblog的敷在不知道够够不够 -
访客
发布文章时候,那怎么改默认状态呢比如改成默认审核状态?