第二次单击菜单切换不起作用

Second click on menu toggle doesn't work

本文关键字：不起作用 菜单 单击 第二次      更新时间：2023-09-26

第一次单击打开菜单工作正常，但第二次不起作用。我自己不是程序员，但我总是试图自己解决问题。我已经搜索了很多答案，但我什至没有接近解决这个问题。您的帮助将不胜感激

.HTML

大约 服务业 客户 联系 
<header id="masthead" class="site-header" role="banner" >
    <div style="width:33%"><i class="fa fa-bars menu-button" aria-hidden="true" onclick="openbox();" style="position:fixed;cursor:pointer;"></i></div>
    <div class="site-branding" style="width:33%">
        <img id="tempdcenterlogosmall" class=" " src="http://oneandother.london/wp-content/uploads/2016/07/logo-150x150.png" style="text-align:center; width:50px; <?php echo $tempdcenterlogosmall; ?> position:fixed;" />

爪哇语

function openbox(){
        var d = document.getElementById("centralboxdiv");
        d.classList.remove("fadeOut");
        d.classList.remove("animated");
        d.className += " fadeIn animated";
        d.style.display = "flex";
        var d2 = document.getElementById("masthead"); 
        d2.style.display = "none";
        var d3 = document.getElementById("maincenterlogo"); 
        d3.style.display = "none";
        var d4 = document.getElementById("tempdcenterlogosmall");
        d4.classList.remove("fadeInUp");
        d4.classList.remove("animated");
        var d5 = document.getElementById("maincenterlogo");
        d5.classList.remove("fadeOutUp");
        d5.classList.remove("animated");
    }
    function closebox(){
        var d = document.getElementById("centralboxdiv");
        d.classList.remove("fadeIn");
        //d.classList.remove("animated");
        d.className += " fadeOut ";
        var d2 = document.getElementById("masthead"); 
        d2.style.display = "flex";
        var d3 = document.getElementById("maincenterlogo"); 
        d3.style.display = "flex";
        //d.style.display = "none";
    }

谢谢

似乎在您的 HTML 中，菜单切换从未有机会调用closebox函数。

我建议你使用一个切换函数（如jQuery中的那个）来处理切换操作，或者一些CSS技巧。

如果坚持使用一个打开函数和一个关闭函数，可以尝试addEventListener。

相关文章：