默认情况下，使 ngx 完美滚动条可见

Question

我在div元素上使用ngx-perfect-scrollbar，如下所示：

<div [perfectScrollbar]="config" [ngStyle]="{ 'max-height': '60vh', position: 'relative' }">
.
.
.
.
</div>

但是只有当我将鼠标悬停在滚动条的div 元素上时，滚动条才可见。 如何使其始终可见？

Answer 1

完美的滚动条被不透明度隐藏。

您可以给出已经声明的类的完美滚动条：

ps-show-always

其中添加了以下内容：

perfect-scrollbar.ps-show-always > .ps.ps--active-y > .ps__rail-y,
perfect-scrollbar.ps-show-always > .ps.ps--active-x > .ps__rail-x {
opacity: 0.6;
}

Answer 2

我通过将以下样式添加到我的全局样式中来解决问题.scss

.ps > .ps__rail-x,
.ps > .ps__rail-y {
opacity: 0.6;
}

这些样式应用于完美滚动条，因为 ngx-perfect-scrollbar 在幕后使用完美滚动条。