在 javascript 中修改颜色

Question

我正在使用我在网上找到的一些 javascript，它会随着水平滚动位置的变化而改变网页的颜色。代码如下：

$(document).ready(function($) {
    checkScroll = setInterval(function(){scrollHorizontal()},10);
  });

function scrollHorizontal() {
  maxScroll = $('.meh').width() - $('body').width();
  scrolledHor = $(window).scrollLeft();
  backgroundOpacity = 'rgba(0,0,0,'+(scrolledHor / maxScroll)+')';
  $('body').css('background',backgroundOpacity);
  $('.pixels').html('Scrolled: '+scrolledHor+' pixels');

}

随着页面慢慢变黑，黑色文本变得不可见，所以我想在页面滚动时将文本的颜色从黑色更改为白色。为此，我修改了代码以增加两行代码，以及适当的 css。见下文：

$(document).ready(function($) {
    checkScroll = setInterval(function(){scrollHorizontal()},10);
  });

function scrollHorizontal() {
  maxScroll = $('.meh').width() - $('body').width();
  scrolledHor = $(window).scrollLeft();

  backgroundOpacity = 'rgba(0,0,0,'+(scrolledHor / maxScroll)+')';
  $('body').css('background',backgroundOpacity);

  textOpacity = 'rgba((255/maxScroll)*scrolledHor,(255/maxScroll)*scrolledHor,(255/maxScroll)*scrolledHor),1';
  $('table').css('color',textOpacity);

  $('.pixels').html('Scrolled: '+scrolledHor+' pixels');

}

不过这似乎不起作用。我认为它与我正在使用的语法有关，但我以前从未使用过 Javascript 所以不确定我做错了什么。有什么建议吗？

Answer 1

我想通了！

  co255 = (255/maxScroll)*scrolledHor;
  textOpacity = 'rgba('+co255+','+co255+','+co255+',1)';

在 javascript 中修改颜色

Modifying colours in javascript

javascript

rgba