向下滚动时Javascript更改DIV颜色答案

【问题标题】：Javascript change DIV colour when scrolling down向下滚动时Javascript更改DIV颜色
【发布时间】：2015-11-01 15:18:58
【问题描述】：

我有这段代码，它不会改变 div 的颜色。我已经尝试了很多来自 stackoverflow 的脚本，但我找不到一个有效的。

$(window).scroll(function(event) {
  var scroll = $(window).scrollTop();
  if (scroll > 20) {
    document.getElementById("scroller").style.background = "#3C3F47";
  }
});

#scroller {
  height: 80px;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; // ie8
  filter: alpha(opacity=50); // ie5-7
  -moz-opacity: 0.5;         // netscape
  -khtml-opacity: 0.5;       // Safari 1.x
  opacity: 0.5;              // Good browsers
  border-bottom: 0px;
}

<div id="scroller" class="navbar-fixed-top scroller">
  asd
</div>

【问题讨论】：

你总是有 scrollTop = 0 因为你没有滚动条。尝试 CSS height: 200% on body 有一个滚动条，然后滚动
您的代码运行良好，我认为您的问题是您的 jquery 代码开头没有使用 $(document).ready()
如果 sn-p 有滚动条并且指定了 jQuery，则 sn-p 可以工作。

标签： jquery html css scroll colors

【解决方案1】：

$(window) 在加载 jquery 时起作用！

您似乎没有加载任何 jquery 文件

1.从此网址下载jquery并将其加载到您的页面上！

http://blog.jquery.com/2013/01/15/jquery-1-9-final-jquery-2-0-beta-migrate-final-released/

2.这样做：

$(function(){
$(window).scroll(function(event) {
  var scroll = $(window).scrollTop();
  if (scroll > 20) {
    document.getElementById("scroller").style.background = "#3C3F47";
  }
});
})

【讨论】：