zblog没有提供导航栏当前分类目录的css样式，因此一般情况下要想给当前分类栏目的导航条高亮显示不能实现，如此一来也导致了一些导航栏效果无法实现。但也并非没有给导航当前分类添加高亮的方法，可以通过jquery和正则表达式匹配实现。下面是具体的操作方法。
实现的操作方法：
给页面加载jQuery库：
1 |
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script> |
在导航下面添加js代码：
1 2 3 4 5 6 7 |
<script type="text/javascript"> $("#menu>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> |
添加上面的js代码后，再给添加进去的样式.current进行css美化，下面是例子，具体的根据自己设计编写：
1 |
#menu li a.current {background:#000; color:#fff;} |
最后重建文件即可。
原创文章，作者：jamestackk，如若转载，请注明出处：https://blog.ytso.com/tech/wp/247890.html