javascript - 响应式菜单隐藏覆盖 div 不显示 onclick

Question

我一直在做我的新网站，我只是遇到了一个问题，就是无法找到正确的功能来打开响应式菜单的隐藏 div。

这是我的代码: https://codepen.io/anon/pen/XRJRGE

  <a class="page-head__menu"  id="js-menu" href="#"         onClick="open()">Menu</a> 

    <script> U = function(t) {
    M.setAttribute("data-state", "visible" === M.getAttribute("data-state") ?     "hidden" : "visible"), this.setAttribute("data-state", "open" ===  this.getAttribute("data-state") ? "closed" : "open"), 
"open" === this.getAttribute("data-state") && O ? (A(k, "white"), A(C, "white")) : O && (E(k, "white"), E(C, "white")), 
  "open" === this.getAttribute("data-state") ? clearInterval($): "/" === e.location.pathname && s(), t.preventDefault()
} </script>

<div id="js-overlay" >
      <ul class="menu-nav">
  <li class="sel"> <a href="/portfolio">Portfolio</a>
  <script>var Z = function(e) {
  var t = this.getAttribute("href");
  N.innerHTML = "", M && (M.setAttribute("data-state", "hidden"), D.setAttribute("data-state", "open")), w(t), a(t), e.preventDefault()
} </script>

  </li>
  <li class="sel"> <a href="/about">About &amp; Contact</a>
  </li>
</ul>
<div class="content"> </div>      
<div class="menu-social">
  <a href="https://facebook.com/bojanaknezevicart" class="page-social__facebook js-social-icon">Facebook</a>
  <a href="http://instagram.com/" class="page-social__instagram js-social-icon">Instagram</a>
  <a href="https://www.behance.net/" class="page-social__behance js-social-icon">Behance</a>
  <a href="http://dribbble.com/" class="page-social__dribbble js-social-icon hide-header">Dribbble</a>
</div></div> </div>

代码太大了，因为我在问题的顶部发布了一个链接。

需要这样:enter image description here

Answer 1

将打开的函数名称更改为其他名称并执行此操作

document.getElementById("js-overlay").style.display = "block"

在那个函数里面。
因为在windows对象中已经有函数open。