Question

我需要在滚动时通过javascript添加课程。我的问题是我需要在达到特定部分ID时添加和删除课程

$(window).scroll(function() {
  var scroll = $(window).scrollTop();

  if (scroll >= 500) {
    $(".clearHeader1").removeClass("video-background");
    $(".clearHeader11").addclass("video-foreground");
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<section id="id1" class="clearHeader1 video-background"></section>
<section id="id2" class="clearHeader1"></section>

Answer 1

试试这个

if($(window).scrollTop() >= $('#id1').offset().top + $('#id1').outerHeight() - window.innerHeight) {
              $("#id1").removeClass("active");
             console.log("removeClass");
             }else{
                console.log("addClass");
             $("#id1").addClass("active");
        }

Answer 2

试试这个

$(window).scroll(function() {
    var scroll =  $(this).scrollTop();
    var section1Height = $('#id1').offset().top + $('#id1').outerHeight() - window.innerHeight;
    if (scroll >= section1Height ) {
        $(".clearHeader1").removeClass("video-background");
        $(".clearHeader11").addclass("video-foreground");
      }

    }

在滚动时使用javascript添加和删除类

2 个答案: