请问通过 scrollTop 控制滚动的元素如何加淡出的动画呢？

Question

因为需要支持手动滚动，所以不能使用 css3 动画属性，比如 transform: translate3d(0, ${curBlockScrollHeight}px, 0)
用 scrollTop 的方式如何给元素添加淡出的效果呢？谢谢

document.getElementById('comment-scroll-wrap').scrollTop = scrollTop;

Answer 1

可以添加平滑滚动，边缘的半透明效果可以添加蒙版，实现如下

.comment-scroll-wrap{
    scroll-behavior: smooth;
    -webkit-mask: linear-gradient(transparent,red 10% 90%,transparent);
}