我已经下载了一个导航栏模板,并努力让它按照我的意愿运行。单击标题时,将打开子菜单以进一步链接。我不希望所有标题打开子菜单,我想要一些只是一个链接I.E home。
当点击主页时,它会突出显示主页,就像打开子菜单一样,并没有转到链接。我认为这是一个js问题。
下面是html:
<nav id="cbp-hrmenu" class="cbp-hrmenu">
<ul>
<li>
<a href="home.php">Home</a>
<li>
<a href="#">Club Information</a>
<div class="cbp-hrsub">
<div class="cbp-hrsub-inner">
<div>
<h4>About the Club</h4>
<ul>
<li><a href="about.php">About IDMC</a></li>
<li><a href="location.php">Where to Find Us</a></li>
<li><a href="whatwedo.php">What We Do</a></li>
</ul>
<h4>Contacting Us</h4>
<ul>
<li><a href="contactus.php">General Information</a></li>
</ul>
</div></div><!-- /cbp-hrsub-inner -->
</div><!-- /cbp-hrsub -->
</li>
</ul>
</nav>
我相信这是导致问题的js,但不确定要改变什么:
var cbpHorizontalMenu=(function(){var b=$("#cbp-hrmenu > ul > li"),g=b.children("a"),c=$("body"),d=-1;function f(){g.on("click",a);b.on("click",function(h){h.stopPropagation()})}function a(j){if(d!==-1){b.eq(d).removeClass("cbp-hropen")}var i=$(j.currentTarget).parent("li"),h=i.index();if(d===h){i.removeClass("cbp-hropen");d=-1}else{i.addClass("cbp-hropen");d=h;c.off("click").on("click",e)}return false}function e(h){b.eq(d).removeClass("cbp-hropen");d=-1}return{init:f}})();
答案 0 :(得分:0)
您想要排除只是链接的项目,而不是下拉列表。因此,在没有子项的链接中添加一个link
类。 <a href="home.php" class="link">Home</a>
然后将Javascript更改为如下所示:代码不应该在链接类的链接上运行。
var cbpHorizontalMenu=(function(){
var b=$("#cbp-hrmenu > ul > li"), g=b.children("a").not($('.link')), c=$("body"), d=-1;
function f(){
g.on("click",a);
b.on("click", function(h){
h.stopPropagation();
})
}
function a(j){
if(d!==-1){
b.eq(d).removeClass("cbp-hropen");
}
var i=$(j.currentTarget).parent("li"), h=i.index();
if(d===h){
i.removeClass("cbp-hropen");
d=-1
}else{
i.addClass("cbp-hropen");
d=h;
c.off("click").on("click",e);
}
return false
}
function e(h){
b.eq(d).removeClass("cbp-hropen");
d=-1
}
return {init:f}
})();