使用滚动条覆盖

我正在努力从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

使用滚动条覆盖

回答

相关问题