Question

切换到另一个页面时，我的下拉菜单出现了一个小问题。当我按下菜单标签按钮时，导航栏向下滑动，然后当我进入另一个页面时，下拉菜单会在其打开时起作用，但当我再次按下菜单标签按钮时，导航栏会向上滑动而不是向下滑动之后它正常工作。

当我切换页面时，如何让滑动条恢复正常状态？ 我希望你明白我的意思，否则我会尽力澄清

HTML

<nav id="navBar">
    <ul id="mainNav">
        <li class="hem"><a href="index.html">Hem</a></li>
        <li><a href="kontakt.html">Kontakt</a></li>
        <li><a href="om.html">Om</a></li>
    </ul>
</nav>

CSS

#navBar {
    display:none;
    position:relative;

}

#navBar.active{
    display:block;
    height:auto;

}

#mainNav {

    background:#202020;

}

#mainNav li {
    padding:6px 0;
}

#mainNav a {
    color:white;
    font-weight:bold;

}

#mainNav li:hover {
    background-color:#f3ba32;

}

JQUERY

$("#menulabel").click(function() {
    $("#navBar").toggleClass("active").slideToggle(300);

});

Answer 1

如果您还没有尝试过，只需在每次加载页面时重置它吗？

$(document).ready(function () {
   $("#navBar").removeClass("active");
});

此外，您确定要对此行为使用点击吗？你看过简单地使用悬停吗？

jquery menu hovering

http://api.jquery.com/hover/

Jquery menu with sub menu hover

切换页面时，我的下拉菜单出现了一个小问题

1 个答案: