javascript - 滚动到底部时如何禁用线性渐变

Question

我正在使用来自具有透明 div 的部分底部的淡出文本的答案，但是在覆盖 div以实现底部的淡化文本 后高度保持在部分之下

我的代码片段如下

<div className={styles.description}>
    {description}
</div>

.description {
        position: relative;
        overflow: auto;
        width: 640px;
        height: 495px;
        padding-right: 17px;
        text-align: justify;
        -webkit-mask-image: linear-gradient(to bottom, black 46%, transparent 100%);
        mask-image: linear-gradient(to bottom, black 46%, transparent 100%);
}

效果是这样的

但是，褪色效果是固定的，所以当我滚动到底部时，它仍然存在，因此，文本末尾的某些行最终会变得不清楚。解决这个难题的一个简单方法是在最后添加一个足够大的透明空间以扩展滚动条，从而使文本摆脱淡出区域。但是，在我看来，这对我来说似乎不是很优雅，所以我想知道是否有方法可以在滚动到底部时禁用线性渐变。非常感谢您的帮助，非常感谢

标签： javascriptcssreactjsless