首页 > 技术文章 > thinkcmf导航栏里面加上js效果

gaojunshan 2017-01-10 16:03 原文

实现的效果图:鼠标放上可以切换背景图

在文章页导航栏需加上的代码:

<php>
    $menu_root_ul_id="main-menu";
    $filetpl="<a href='\$href' target='\$target'>\$label</a>";
    $foldertpl="<a class='dropdown-toggle' href='\$href' target='\$target'>\$label</a>";
    $ul_class="dropdown-menu" ;/*内部ul标签的class属性值*/
    $li_class="" ;/*内部li标签的class属性值*/
    $menu_root_ul_class="nav";/*菜单根节点ul标签的class属性值*/
    $showlevel=6;/*显示菜单的层级*/
    $dropdown='dropdown';/*含有子菜单的li标签的class属性值,用于控制多级菜单的折叠*/
</php>

{:sp_get_menu("main",$menu_root_ul_id,$filetpl,$foldertpl,$ul_class,$li_class,$menu_root_ul_class,$showlevel,$dropdown)}

  js代码这成这样:

<script>
gl();
var num=0;
function gl()
{
	var myNav = $(".logoandnav .right li a"),i;
	for(i=0;i<myNav.length;i++)
	{
		var links =myNav.eq(i).attr("href"),myURL =document.URL;
		if(myURL.indexOf(links) != -1) 
		{
			myNav.eq(i).parent().addClass("cur");
		}
	}
}
$(".logoandnav .right").mouseenter(function(e) {
	$(this).children("ul").children("li").removeClass("cur");
}).mouseleave(function(){
	gl();
});
</script>

  

推荐阅读