带有固定边栏和BootStrap v3的jQuery SlimScroll溢出问题

Question

我正在尝试开发一个类似于以下内容的页面： http://jsfiddle.net/fatgamer85/677U8/7/

我有一个固定的侧边栏div，其中包含一个菜单项列表，可以弹出子菜单或div。我正在使用一个名为SlimScroller的jquery库为固定的侧边栏div创建一个facebook风格的滚动条。我旁边有另一个div，里面有一张地图，底部有一个div，它是一个固定的页脚。

页面布局的方式是侧栏占据屏幕的15％，其余部分占据地图区域。

当我将鼠标悬停在侧边栏中的列表项上时，我希望看到子菜单在悬停时弹出。由于溢出被隐藏，这不会发生，如图所示：

.page-sidebar {
    overflow: hidden;
}

但是当我强制使用'！important'关键字显示侧边栏的溢出时，我可以看到我的子菜单在悬停时弹出：

.page-sidebar {
    z-index: 1000 !important;
    overflow: visible !important;
}

我尝试使用JavaScript在悬停时更改CSS，但由于某种原因这不起作用。

修改

有没有一个解决方案可以确保Sidebar Scrolls以及我可以使用或不使用JavaScript来获取弹出窗口？

我目前已添加了.page-sidebar类以显示弹出窗口。通过这样做，补充工具栏不会滚动。如果我删除了.page-sidebar类，侧边栏会再次滚动，但这次弹出窗口不会出现。

我做错了什么？