javascript - 当超过某个区域/部分时将类添加到 div

Question

我试图在深色标题上更改导航颜色。我已经设法做到了这一点，但页面在该状态下无法加载。

您可以在这里看到，导航左上角从白色变为黑色，无论它是否位于深色顶部栏标题上方。

http://www.pagedev.co.uk/clients/lotuslaser/

这是我的 Jquery。

<script>
  var header = $('#nav_list'),
    blueSection = $('.full-header'),
    // Calculate when to change the color.
    offset = blueSection.offset().top + blueSection.height() - header.height();

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

    // Remove Class "dark" after scrolling over the dark section
    if (scroll >= offset) {
      header.removeClass('white-nav');
    } else {
      header.addClass('white-nav');
    }

    // Remove Class "no-shadows" whenever not on the top of the page.
    if (scroll >= 1) {
      header.removeClass('no-shadow');
    } else {
      header.addClass('no-shadow');
    }
  });
</script>

任何帮助都会很棒!

关于同一问题的另一个问题...我如何在混合物中添加另一个容器，以便当它滚动到页面底部的黑色 strip 上时它也可以变成白色。

提前谢谢您。

李

Answer 1

我认为最好的方法是使用 Midnight.js插件