我前几天制作的可折叠导航栏适用于 Chrome、Firefox、Safari 和 Edge。它在 Internet Explorer 中不起作用。
问题是导航栏折叠后导航栏的链接仍然可见。因此正文内容覆盖在导航栏的链接之上。所有链接也仍然可以点击。
这是我崩溃的 javascript,没什么特别的。
<script>
function openNav() {
document.getElementById("menu").style.width = "20em";
$("#footer").show();
}
function closeNav() {
document.getElementById("menu").style.width = "0";
document.getElementById("content").style.marginLeft = "0";
$("#footer").hide();
}
function toggle() {
var toggleButton = $("#toggleButton");
if (toggleButton.attr('name') === 'open') {
closeNav();
toggleButton.attr('name','close');
} else {
openNav();
toggleButton.attr('name','open');
}
}
</script>
最佳答案
我通过显示和隐藏包含链接的 div 解决了这个问题。
<script>
function openNav() {
document.getElementById("menu").style.width = "20em";
$("#footer").show();
$("#links").show();
}
function closeNav() {
document.getElementById("menu").style.width = "0";
document.getElementById("content").style.marginLeft = "0";
$("#footer").hide();
$("#links").hide();
}
function toggle() {
var toggleButton = $("#toggleButton");
if (toggleButton.attr('name') === 'open') {
closeNav();
toggleButton.attr('name','close');
} else {
openNav();
toggleButton.attr('name','open');
}
}
</script>
关于html - 让可折叠导航栏在 Internet Explorer 中工作的问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55766865/