使用滾動條覆蓋

我正在努力從tutorials之一製作覆蓋菜單。這是做菜單的好方法。只有問題，我注意到，當你有大菜單，那麼你不能向下滾動頁面中的文字較少，如example one 使用滾動條覆蓋

在第二個例子中，我有很多頁面文本和靜止，當我滾動它滾動頁面文本，但不覆蓋。你可以在背景頁面滾動中注意到。 example two

如何我做只能使覆蓋滾動，而不是實際的頁面，這樣，當萬一我有瑪吉菜單，然後我在會滾動到菜單的長度

HTML代碼

<div class="container"> 

    <section> 
     <p>Overlay fades in and menu rotates slightly in perspective. As seen on <a href="http://hugeinc.com">Huge</a></p> 
     <p><button id="trigger-overlay" type="button">Open Overlay</button></p> 
    </section> 

</div><!-- /container --> 
<!-- open/close --> 
<div class="overlay overlay-hugeinc"> 
    <button type="button" class="overlay-close">Close</button> 
    <nav> 
     <ul> 
      <li><a href="#">Home</a></li> 
      <li><a href="#">About</a></li> 
      <li><a href="#">Work</a></li> 
      <li><a href="#">Clients</a></li> 
      <li><a href="#">Contact</a></li> 
      <li><a href="#">About 2</a></li> 
      <li><a href="#">Work 3</a></li> 
      <li><a href="#">Clients 4</a></li> 
      <li><a href="#">Contact 5</a></li> 
     </ul> 
    </nav> 
</div>

來源

2015-10-18 Learning

將overflow-y: scroll;添加到您的.overlay元素中，您將在該元素上有一個垂直滾動條

來源

2015-10-18 10:06:27 sticksu

使用滾動條覆蓋

回答

相關問題