菜单转换

Question

我试图重建，而不是复制和粘贴此网站http://paramoredigital.com/仅用于学习指导。 我在菜单转换方面遇到了问题，更确切地说，如果单击右上角的按钮，菜单将顺利显示，并且我不知道如何在代码中进行操作。

这是我的代码https://github.com/Szuchow/paramore-digital 。

Answer 1

单击X，将出现菜单。 剩下的只是样式问题。

 $("body").on("click", function() { $(".menu").addClass("open"); }) 

 body { padding: 0; } .container { width: 100vw; height: 100vh; background: lightblue; } .menu { position: absolute; top: 0; left: 0; opacity: 0; background: pink; transition: opacity 1s ease; width: 100vw; height: 100vh; } .menu.open { opacity: 1; } .toggle a { font-size: 2em; text-decoration: none; cursor: pointer; } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="container"> <span class="toggle"><a href="#">X</a></span> <div class="menu"> <ul> <li>Option 1</li> <li>Option 2</li> <li>Option 3</li> </ul> </div> </div>