使用jquery更改导航栏中滚动的字体颜色

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>

<nav>
  <ul>
    <li><a href="#" class="scrolling-text">Home</a></li>
    <li><a href="#" class="scrolling-text">About</a></li>
    <li><a href="#" class="scrolling-text">Services</a></li>
    <li><a href="#" class="scrolling-text">Contact</a></li>
  </ul>
</nav>

$(window).scroll(function() {
  var scrollPosition = $(window).scrollTop();
  var navHeight = $('nav').outerHeight();

  $('.scrolling-text').each(function() {
    var elementOffset = $(this.hash).offset().top - navHeight;

    if (elementOffset <= scrollPosition) {
      $(this).css('color', 'red'); // 设置滚动字体颜色为红色
    } else {
      $(this).css('color', 'black'); // 设置默认字体颜色为黑色
    }
  });
});