当我仅在移动视图中单击汉堡包时,粘性导航栏消失

不知道为什么,但粘性导航栏工作正常,除非我在移动视图中向下滚动。当我单击“菜单单击此处”时,整个导航栏消失。

我认为 javascript 函数正在删除粘性类,但我不知道如何解决这个问题。

http://lonestarwebandgraphics.com/

/* Toggle between adding and removing the "responsive" class to bottomnav when the user clicks on the icon */function myFunction() {var x = document.getElementById("mybottomnav");if (x.className === "bottomnav") {
x.className += " responsive";
} else {
x.className = "bottomnav";
}
}

https://img1.sycdn.imooc.com/652e76cd0001777313630748.jpg

https://img1.sycdn.imooc.com/652e76d90001c84113530749.jpg

阿波罗的战车
浏览 66回答 1
1回答

牛魔王的故事

问题出在你的myFunction函数上。<a href="javascript:void(0);" class="icon" onclick="myFunction()"><p>Menu Click Here </p>&nbsp; ☰</a>在这里,您可以调用您myFunction()来切换汉堡菜单的状态。但是,myFunction无法管理切换。因此,要使其正常工作,请更改当前版本function myFunction() {&nbsp; var x = document.getElementById("mybottomnav");&nbsp; if (x.className === "bottomnav") {&nbsp; &nbsp; x.className += " responsive";&nbsp; } else {&nbsp; &nbsp; x.className = "bottomnav";&nbsp; }}下面这个:function myFunction() {&nbsp; var x = document.getElementById("mybottomnav");&nbsp; if(x.classList.contains("responsive")) {&nbsp; &nbsp; x.classList.remove("responsive");&nbsp; } else {&nbsp; &nbsp; x.classList.add("responsive");&nbsp; }}
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

Html5