这就是我所拥有的:
.s2 {
top: 150px;
left: 20px;
position: absolute;
transition: left 300ms linear;
}
我使用JavaScript在滚动时动态更改左侧位置。目前,即使在移动设备上,甚至在台式机浏览器中,性能也很差。
我该如何改善?有更好的方法吗?
答案 0 :(得分:1)
考虑使用requestAnimationFrame对滚动进行节流
使用“ translate”之类的属性来代替“ left”或“ top”
通过广告translationZ(0)或translate3d(0,0,0)触发移动设备上的GPU(并非始终保证)
此外,由于要在滚动过程中进行动画处理,因此不需要使用transition属性,除非在滚动量超过某个值时有断点/阈值可用于设置该属性。