響應式菜單問題 - 點擊時未打開

我有一個響應菜單，但我遇到的問題是，當它被重新調整大小時，菜單不會在點擊時下拉。我已經包含了一個codepen。不要擔心這三條線沒有出現，他們在實際的網站上做。響應式菜單問題 - 點擊時未打開

代碼菜單

<label for="show-menu" class="show-menu"><i class="fa fa-bars fa-2x"></i></label> 
    <input type="checkbox" id="show-menu" role="button"> 
     <nav class="cl-effect-4"> 
     <ul id = "nav" class="cl-effect-4"> 
      <li><a href="index.php?page=work">WORK</a><span class="slash-size">/</span></li> 
      <li><a href="index.php?page=about">ABOUT</a> 
     </ul> 
     </nav>

在此先感謝

來源

2016-04-03 Gareth

你需要爲了處理菜單的打開和關閉的JavaScript。如果你可以使用jQuery，添加如下內容：

$('.show-menu').click(function() { 
    $('#nav').toggle(); 
})

編輯：啊，現在我明白你想使用複選框CSS技巧來顯示/隱藏菜單。更改input[type=checkbox]:checked ~ #nav{爲input[type=checkbox]:checked ~ nav #nav{

來源

2016-04-03 10:31:12 Laurens

謝謝，這有效，但是當我打開漢堡包菜單並關閉它然後重新調整大小恢復正常它菜單消失，任何想法？它保持，如果我打開漢堡菜單，然後重新調整大小恢復正常 – Gareth

它仍然有同樣的問題，當我重新調整瀏覽器的大小，漢堡菜單顯示，我點擊它，鏈接出現。如果我關閉它並重新調整瀏覽器的大小，鏈接將消失。 – Gareth

它沒有使用CSS方法的問題。不要忘記刪除我之前編寫的JavaScript代碼。它會通過添加nav bevore #nav來工作，正如我在編輯答案中所說的那樣。 – Laurens

響應式菜單問題 - 點擊時未打開

回答

相關問題