为了更改滚动灵敏度/速度,我将 transfrom: translateY(x)
分配给元素,其中 x 是一个动态数字。该数字根据当前滚动位置而变化:
@HostListener('document:scroll', ['$event'])
onScroll($event) {
this.translateScrollable = (scrollY) / 1.5;
}
Chrome、Mozilla 等工作正常,但无法打开它。 on Edge 将在闪烁的盛宴中结束。我该如何解决这个问题?
最佳答案
考虑在将被转换修改的元素上使用 will-change
属性。
.element-with-transform {
will-change: transform;
}
What this does is that it promotes the elements to another layer, so the browser doesn’t have to consider the layout render or painting.
您可能还想考虑对事件添加限制,以限制触发回调的次数。
关于html - 某些浏览器滚动时 TranslateY 闪烁,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59313451/