17站长网

17站长网 首页 CMS dedecms 查看内容

织梦CMS的导航条栏目高亮显示的方法

2023-8-1 12:27| 查看: 1308 |来源: 互联网

备注CSS里面的写法:#menu li.menu_on{width:100px; height:44px; float:left; text-decoration:none; background:url(menuhover.png) bottom no-repeat} 第一种 ...

备注CSS里面的写法:#menu li.menu_on{width:100px; height:44px; float:left; text-decoration:none; background:url(menuhover.png) bottom no-repeat}

第一种方法:JS代码实现高亮显示

这里是模板文件.HTM里面的代码,下面的JS加载导航代码的下面。

<div id="menu">

<ul>

<li><a href="/">网站首页</a></li>

<li><a href="/">免费模板</a></li>

</ul>

</div>

<script type="text/javascript" language="javascript">

var nav = document.getElementById("menu");

var links = nav.getElementsByTagName("li");

var lilen = nav.getElementsByTagName("a");

var currenturl = document.location.href;

var last = 0;

for (var i=0;i<links.length;i++)

{

var linkurl = lilen[i].getAttribute("href");

if(currenturl.indexOf(linkurl)!=-1)

{

last = i;

}

}

links[last].className = "menu_on";

</script>

第二种方法:织梦标签实现高显示

<div id="menu">

<ul>

<li {dede:field name=typeid runphp="yes"}(@me=="")? @me=" class=‘menu_on‘":@me="";{/dede:field}><a href="/">网站首页</a></li>

{dede:channel type=‘top‘ row=‘8‘ currentstyle="<li ‘menu_on‘><a href=‘~typelink~‘ >~typename~</a> </li>" }

<li><a href="[field:typelink/]">[field:typename/]</a></li>

{/dede:channel}

</ul>

</div>

相比大家更愿意适用第二种方法的哦!

本文最后更新于 2023-8-1 12:27,某些文章具有时效性,若有错误或已失效,请在网站留言或联系站长:17tui@17tui.com
·END·
站长网微信号:w17tui,关注站长、创业、关注互联网人 - 互联网创业者营销服务中心

免责声明:本站部分文章和图片均来自用户投稿和网络收集,旨在传播知识,文章和图片版权归原作者及原出处所有,仅供学习与参考,请勿用于商业用途,如果损害了您的权利,请联系我们及时修正或删除。谢谢!

17站长网微信二维码

始终以前瞻性的眼光聚焦站长、创业、互联网等领域,为您提供最新最全的互联网资讯,帮助站长转型升级,为互联网创业者提供更加优质的创业信息和品牌营销服务,与站长一起进步!让互联网创业者不再孤独!

扫一扫,关注站长网微信

大家都在看

    热门排行

      最近更新

        返回顶部