滚动sidenav时如何防止滚动主要部分

Question

在我的Angular应用程序中，我有一个sidenav和一个主要部分。我正在寻找的行为是，当我在sidenav中滚动时，我不希望在主要部分中发生任何滚动。我希望它的行为就像Angular Material Design doc site一样。

目前正在发生的事情是，当在sidenav中滚动时，一旦我到达底部，它就开始滚动主导航。

我的两难困境演示： http://embed.plnkr.co/hyFPXDHCgJqUcJQ6u29i/preview

我该怎么做才能解决这个问题？

Answer 1

您需要检查外部文件，可能是引导程序。 删除所有链接后，只使用style.css，以下工作正常。请注意，我将is_right替换为要测试的右列。

.list-group {
    position: fixed;
    top: 0;
    right: 70%;
    bottom: 0;
    left: 0;
    overflow: auto;
}

.is_right {
    margin-left: 30%;
}