BOOTSTRAP 4-将Scrollspy加入到Scrolltop

Question

我在BOOTSTRAP中越来越接近HTML，CSS和JAVA。 我试图将SCROLLSPY函数“合并”到SCROLLTOP。我想更改外观（大小，颜色...）。所有响应。

对于SCROLLTOP，我使用此脚本，但它没有响应：

$(document).ready(function() {
  $(window).on("scroll", function() {
    if ($(window).scrollTop() >= 50) {
      $(".navbar").addClass("compressed");
    
    } else {
      $(".navbar").removeClass("compressed");
    
    }

    if ($(window).scrollTop() >= 1000) {
      $(".navbar").addClass("compressed2");

    } else {
      $(".navbar").removeClass("compressed2");

    }
  });
});

对于SCOLLSPY，我使用以下代码：

$(document).ready(function(){
  $('body').scrollspy({target: ".navbar", offset: 50});

  $("#navbarTarget a").on('click', function(event) {
    if (this.hash !== "") {
      event.preventDefault();

      var hash = this.hash;

      
      $('html, body').animate({
        scrollTop: $(hash).offset().top
      }, 800, function(){

        window.location.hash = hash;
      });
    }  
  });
});

有一种使用ID或HREF ...或其他功能（我不知道）来开始动画的方法。

THX