小编And*_*yjm的帖子

我想在滚动时转换固定标题元素的背景颜色.因此,当用户向下滚动整页块网站时,标题会巧妙地改变以补充块颜色.我几乎已经在Pen上实现了这一点,但是我无法确定如何测量已滚动多少作为何时更改的标志.

一些额外信息:要更改的滚动量为400px.背景颜色以数组形式存储和提取.作为参考我的jQuery代码如下:

$(document).ready(function(){
  var bgArray = ["#252525","#333333","#454545","#777777"];  
  var scrollHeight = 400;
  var scrolled = $(window).scrollTop(); //What is this measuring?

  $(window).scroll(function() { //Can these conditions be neatened into one function?
    if(scrolled < scrollHeight) {
      $('header').css('background', bgArray[0]);
    }
    if(scrolled > scrollHeight) { // i.e more than 400px
      $('header').css('background', bgArray[1]);
    }
    // and so on (800, 1200...)
  })
})

有关完整代码,请参阅笔.任何建议都非常感谢!