Question

我做了一个小Javascript功能，改变了身体的背景颜色。但是，它运行时似乎非常缓慢和锯齿状。有谁知道为什么以及如何改进代码以使其运行更顺畅？

请参阅JSfiddle了解工作示例：https://jsfiddle.net/2s2e737w/

＆＃13;

 	window.addEventListener('scroll', function() {

var fromTop = window.pageYOffset;
document.body.style.backgroundColor = "rgb("+fromTop/5 + ','+fromTop/2 +','+fromTop/3+")";
   });

＆＃13;

body{
	margin:0 ;
	padding: 0;
	height: 3000px;
    background-color:rgb(0,0,0);
}
p{
    color:white
}

＆＃13;

<p>
Scroll
</p>

＆＃13;

Answer 1

仅使用整数RGB值，因为浏览器会忽略十进制值，这会导致感知延迟：

document.body.style.backgroundColor = "rgb(" +
    parseInt(fromTop/5, 10) + ',' +
    parseInt(fromTop/2, 10) + ',' +
    parseInt(fromTop/3, 10) + ")";

百分比值也可以接受：

https://developer.mozilla.org/en-US/docs/Web/CSS/color_value#rgb

正文风格Javascript函数似乎很慢

1 个答案: