div容器添加纵向滚动条后无法显示定位的二级子菜单

问题描述：一个最外层的容器div，里面包含若干菜单列表div,当鼠标滑过菜单显示下属包含的二级菜单，二级菜单是通过绝对定位控制显示位置，当给整个div容器加了纵向滚动条后，二级菜单被遮挡无法显示。

功能样式展示：

出现的问题图例展示：

尝试过的解决方法：尝试过给二级菜单设置层级远高于整体的div容器，没有效果；

需求描述：在不改变原有需求的前提下，给整体div容器添加纵向滚动条，且滑过菜单时能够显示下属的二级菜单。

你的问题可能是由于你的二级菜单是在具有滚动条的div容器中绝对定位的。由于滚动条的存在，你的二级菜单实际上是被限制在了这个容器的边界内，而无法超出这个边界显示。要解决这个问题，你需要将二级菜单放在滚动条所在的div的外部。

你可以尝试以下的解决方案：

对父级div设置 position: relative;，这样子元素的 position: absolute; 会相对于这个父元素定位。
将二级菜单放置在一个更高层级的容器中，而非在具有滚动条的div内部。这样你可以使二级菜单相对于更高层级的容器进行定位，这就需要改动你的HTML结构，使二级菜单不再是滚动条div的子元素，而是其同级元素或者它的兄弟元素。
示例如下：
```
<div class="container">
    <div class="menu">菜单</div>
    <div class="submenu">二级菜单</div>
</div>
```
二级菜单可以使用JavaScript动态插入到DOM中，这样你可以直接插入到body中，然后再通过JavaScript动态计算并设置其位置。

以上只是一些基本的解决思路，具体的实现可能需要根据你的页面结构和需求进行调整。

感觉挺麻烦的，那你二级菜单就得相对于最大的div定位，也就是加了滚动条的div .这样的话，你只能用js 实现hover 。而且你还得计算定位的 rigth值 top值。

不知道你这个问题是否已经解决, 如果还没有解决的话:

你可以看下这个问题的回答https://ask.csdn.net/questions/7797953

如果你已经解决了该问题, 非常希望你能够分享一下解决方案, 写成博客, 将相关链接放在评论区, 以帮助更多的人 ^-^