【导航栏当前页高亮】-z-blog让导航突出显示当前页链接条目

admin

关键字描述：链接 当前 显示 导航 突出 li id=current首页/li，然后再用CSS定义就完成了。 </p>    <li class="level1">    setp1 :加入js(jQuery代码)，如下    原先功能简单的代码

1. script type=text/javascript$(document).ready(function(){$(#menu ulli).each(function() {  //我们假设导航部分的ID为menu，结构是div id=menuulli...    if ($(this).find(a).attr(href)==document.URL){    $(this).attr(id,current)  //给当前页的li加上id=current，如li id=current首页/li    }});});/script

复制代码

haphic将这一代码做了完善，此代码只支持 Z-Blog 模板.
haphic 完善后的代码

1. script type=text/javascript    $(#menu ulli).each(function() {        if ($(this).find(a).attr(href).toLowerCase() !== str00.toLowerCase()){            if (document.URL.toLowerCase().indexOf($(this).find(a).attr(href).toLowerCase()) !== -1){                $(this).attr(id,current)            }        }else{            if ($(this).find(a).attr(href).toLowerCase() == document.URL.toLowerCase()){                $(this).attr(id,current)            }        }    });/script

复制代码

   <li class="level1">    setp2 :定义CSS样式   

1. #menu ul li#current { background-color:#fff; color:#0B1316;}

复制代码