修复了带颜色的导航栏

Question

向下滚动时，我需要用颜色填充固定导航栏。 我怎样才能让它在顶部透明，但在滚动时是白色的？

我假设它可以用 Jquery 实现，但我没有这方面的经验，而且商店是使用 shopify 构建的，这使得编辑代码时有点复杂。

这是我店铺的链接https://h-azeem-london.myshopify.com/

提前致谢

Answer 1

与你的 CSS 类似的东西......

header.main-header {
  position: fixed;
  background-color: white;
}

然后用 jQuery...

$(window).on("scroll", function () {
    if ($(this).scrollTop() > 50) {
        $("header").css("background-color","rgba(255, 255, 255, 0.25)");
    }
});