javascript - 启用垂直滚动时如何添加填充

Question

我有一个元素列表，当高度达到 200px 时，我会显示垂直滚动(overflow-y: auto;)。但我想在启用滚动时添加 padding-right:20px 否则我不想要 padding-right。 我知道使用 jquery 我们可以检查高度并应用但我使用的是 angularjs 所以即使加载了 dom 我的 jquery 没有得到应用，我也尝试在 window.load 之后添加但没有成功。

ul{
      list-style:none;
      padding-left:0;
      margin-left:0;
      margin-top: 20px;
      padding-left: 5px;
      padding-right: 20px;
      overflow-y:auto;
      height:200px
    }

在上面的样式中我添加了padding-right20px；我只想在启用垂直滚动时应用。这是我的 Fiddle 请让我知道获得此信息的任何建议。当高度超过 200px 时，这里还有一个 fiddle ， Fiddle with scroll enabled

Answer 1

试试这个:

<ul ng-style="list.length>7 ? {'padding-right': '20px','overflow-y':'auto'}:{'padding-right': '0'}"> ... </ul>

CSS:

  ul {
    list - style: none;

    padding - left: 0;
    margin - left: 0;
    margin - top: 20 px;
    padding - left: 5 px;

    height: 200 px
}
li {
    background: gray;
    color: #fff;
    margin - bottom: 10 px;
}
.container {
    width: 300 px
}

会为你工作。