在网站制作过程中,经常见到很多网站的导航栏中当前所在的栏目分类链接被添加了css样式,呈高亮状态,点击哪个分类链接哪个就会变成高亮状态,那么这种功能是怎么实现的呢,其实用jQuery就可以很轻松的实现。
jquery代码:
/* 当前链接加css */
$('nav ul li a').each(function () {
if ($(this)[0].href == String(window.location))
$(this).parent().addClass('active');
});
html代码:
<nav>
<ul>
<li><a id="5" title="环境类型" href="http://localhost/myyiqicms/allcategory.php">环境类型</a></li>
<li><a id="6" title="所有产品" href="http://localhost/myyiqicms/allproduct.php">所有产品</a></li>
<li><a id="2" title="公司历程" href="http://localhost/myyiqicms/article/about.html">公司历程</a></li>
<li><a id="15" title="标准文献" href="http://localhost/myyiqicms/category.php?name=zl.html">标准文献</a></li>
<li><a id="4" title="联系购买" href="http://localhost/myyiqicms/comment.php">联系购买</a></li>
</ul>
</nav>
本站原创内容,如需转载请注明来源:https://www.liutonghui.com/127.html
评论列表(0条)
暂时没有评论!