滚动网站 - 当滚动传递一个部分时，我希望我的导航div改变颜色

Question

我没有使用任何框架。每次滚动页面上的某个部分时，如何使导航div更改颜色？

这是我的网页：http://www.noteid.com/scl

如您所见，左侧有导航position: fixed;。 我怎么能用Javascript做到这一点？

Answer 1

您需要使用滚动事件。

window.onscroll = function() {
    var element = document.getElementById('testDiv');
    if (window.pageYOffset > 400 && window.pageYOffset < 800) 
        element.style.backgroundColor = 'blue';
};

这使用pageYOffset属性来设置背景属性。

http://jsfiddle.net/N82fS/9/

Answer 2

我会使用Bootstrap的ScrollSpy来做这样的事情。

http://getbootstrap.com/javascript/#scrollspy