Scroll 唤醒时更改滚动条上的引导导航栏图像

Scroll 唤醒时更改滚动条上的引导导航栏图像,scroll,navbar,Scroll,Navbar,我卡住了,我不知道如何在滚动期间更改图像源(白色徽标为黑色徽标)。 以下是我正在处理的页面的链接: 如果您滚动页面,您会注意到徽标将字体格式从带黑色背景的白色正面更改为带白色背景的黑色字体 有人能给我指出正确的方向吗?你可以创建一个jquery.scroll()事件来测试窗口的scrollTop()值(检查页面是否在顶部附近滚动),然后根据该值更改图像的src属性。向下滚动时,窗口的.scrollTop()值将增加 尝试将其添加到元素的末尾,在其他元素之后: <script>

我卡住了,我不知道如何在滚动期间更改图像源(白色徽标为黑色徽标)。 以下是我正在处理的页面的链接:

如果您滚动页面,您会注意到徽标将字体格式从带黑色背景的白色正面更改为带白色背景的黑色字体


有人能给我指出正确的方向吗?

你可以创建一个jquery
.scroll()
事件来测试窗口的
scrollTop()
值(检查页面是否在顶部附近滚动),然后根据该值更改图像的
src
属性。向下滚动时,窗口的
.scrollTop()
值将增加

尝试将其添加到
元素的末尾,在其他
元素之后:

<script>

  var base = 'https://www.camarilloflightinstruction.com/sandbox/2020/images/';

  $(window).scroll(function(){
    if($(this).scrollTop() > 100){
      $('nav.navbar .navbar-brand img').attr('src', base + 'CFI_black.png')
    }
    else {
      $('nav.navbar .navbar-brand img').attr('src', base + 'CFI_white.png')
    }
  })

</script>

var base=https://www.camarilloflightinstruction.com/sandbox/2020/images/';
$(窗口)。滚动(函数(){
如果($(this).scrollTop()>100){
$('nav.navbar.navbar brand img').attr('src',base+'CFI_black.png'))
}
否则{
$('nav.navbar.navbar brand img').attr('src',base+'CFI_white.png'))
}
})