Question

我在使用jQuery滚动时进行了这种身体背景颜色转换。

代码从颜色1（白色）到颜色2（黑色），以及向后，从颜色2到颜色1。

然而，颜色3或颜色4不起作用，我在if语句上尝试了几处更改，但我无法弄清楚为什么它不能使用2种以上的颜色。

body { height: 2400px; transition: background-color 1s ease-in; }


$(window).scroll(function() {    
var scroll = $(window).scrollTop();

if (scroll == 0 || scroll < 500) {
  $("body").css("background-color","white");
} 
else if (scroll >= 500 || scroll < 1000) {
  $("body").css("background-color","black");
} 
else if (scroll >= 1000 || scroll < 1500) {
  $("body").css("background-color","green");
}
else {
  $("body").css("background-color","white");
}});

谢谢！

Answer 1

您没有使用正确的比较运算符而不是||使用＆amp;＆amp;

这是工作的js代码

    $(window).scroll(function() {    
    var scroll = $(window).scrollTop();

    if (scroll < 500) {
      $("body").css("background-color","white");
    } 
    else if (scroll >= 500 && scroll < 1000) {
      $("body").css("background-color","black");
    } 
    else if (scroll >= 1000 && scroll < 1500) {
      $("body").css("background-color","green");
    }
    else {
      $("body").css("background-color","white");
    }
});

这是codepen wokring版本

Answer 2

使用＆＃39;＆amp;＆amp;＆＃39;而不是＆＃39; ||＆＃39;在你的if条件

滚动时，正文背景颜色不会发生变化

2 个答案: