停止在后面的 div 中滚动答案

【问题标题】：Stop scrolling in back div停止在后面的 div 中滚动
【发布时间】：2013-12-19 12:11:39
【问题描述】：

我正在使用 HTML5 和 CSS3 为 iPhone 和 Android 编写一个网络应用程序。

我上面有一个背景 div 和一个菜单 div。（更大的 z-index）并且两个 div 都有溢出并且是可滚动的。

问题是，即使我在顶部 div（菜单）上滑动手指，底部 div（背景）仍在滚动。有时两者同时滚动，有时只滚动其中一个。

我只希望在我用手指在菜单区域上滑动时滚动菜单。

谁能帮忙？

这是我的代码：

HTML：

<html>
   <body>
      <div id="main">

         <div id="menu">

           <!-- menu content goes here -->

         </div>

      </div>
   </body>   
</html>

CSS：

#main: {
   height: 3000px;
   overflow: scroll;
}

#menu: {
   height: 2500px;
   padding-left: 10px;
   overflow-y: scroll;
}

【问题讨论】：

有什么可以帮助您的吗？
请把你的代码放在这里
请告诉我如何禁用背景 div 的滚动？（这是一个巨大的项目......代码很大。我会尝试做一个小例子）
查看我的解决方案，如果它不起作用...尝试将溢出设置为隐藏

标签： javascript android jquery css

【解决方案1】：

我做了类似的东西。你的问题有点不清楚......但我必须制作一个不可见的可滚动 div......这是我的 css......

#sidebar{
    width: 1000px;
    height: 670px;
    border: 0px solid transparent;
    overflow: hidden;
    text-align: center;
    padding-left: 0.5%;
    background-color: transparent;
    color: transparent;
}

#sidebar #scroller{
    width: 1000px;
    height: 545px;
    padding-bottom: 15px;
    overflow: scroll; 
    overflow-x: hidden;
    text-align:center;
    background-color: transparent;
}

现在在我的 html 中...

   <div id="sidebar">
      div id="scroller">
          // the things i add in my scrollable menu...
      </div>
    </div>

【讨论】：

你也可以像我一样在这些类后面添加背景类，以使我的看起来像一个 ios 滚动列表或任何你叫它的东西
非常感谢，首先。这有点像我所做的。问题是 - 我在侧边栏菜单后面有一个很大的主 div。当我滚动侧边栏时它也在滚动......我不希望这种情况发生。当我滚动侧边栏时 - 我希望背景保持不变。
所以我想。我为黑莓设备做了同样的事情...... ulg......代码对你/工作有帮助吗？
如果那个 div 是可滚动的（大的主 div），你需要确保它不能滚动。将溢出设置为隐藏。通常有效。否则，请告诉我们
侧边栏在需要时进出屏幕。所以我确实需要主 div 可以滚动当菜单关闭时...