jquery - jquery动态切换菜单颜色

Question

我有一个固定顶部菜单到左上页的站点，这个菜单是白色的并且有透明的背景。我的页面分为页面宽度的 100% 的图像，在图像下方有白色背景上的文本。滚动页面的白色部分时，我想将菜单的颜色切换为黑色。在图像上切换回白色。我认为最好的切换方法是给图像设置断点，所以当菜单的滚动高度低于顶部图像页面的滚动顶部时，菜单为黑色，而何时超过顶部图像页面的滚动顶部及下方底部图像页面的滚动顶部是白色的。

第一个例子，白色菜单

第二个例子，黑色菜单

不同的页面

Ps 我没有固定的图像/文本位置，因为站点的页面在上下文的基础上是不同的，所以我需要一个动态工作的代码。jquery有什么建议来完成这个吗？

这是我实际解决方案的代码，但仅适用于最后一张图片

$(window).scroll(function(){  
$("img.scrollMenuNero").each(function(){
  if($(window).scrollTop()+$(".iconeNavbar").height()>$(this).offset().top + $(this).outerHeight() && !$(".divBarraLaterale").hasClass("open")){
    $(".divBarraLaterale a, .iconeNavbar, .divBarraLaterale i").css("color","#333");
    $(".imgNavBar").attr("src","/images/icona-navbar-nauticabluemarine-dark.png")
  }else{
    $(".divBarraLaterale a, .iconeNavbar, .divBarraLaterale i").css("color","#fff");
    $(".imgNavBar").attr("src","/images/icona-navbar-nauticabluemarine.png")
  }      
})
})

标签： jqueryhtmldom