时间戳

首页 > 解决方案 > 在滚动时更改引导 3 导航栏的颜色

javascript - 在滚动时更改引导 3 导航栏的颜色

问题描述

这是我的问题：

Navbar当用户向下滚动时，如何将我的 Bootstrap 3颜色从透明更改为白色？

请帮忙。

顺便说一句，navbar我使用的代码是 Bootstrap 文档/W3schools.com 中的默认代码。

标签： javascripthtmlcsstwitter-bootstrap-3navbar

解决方案

window.addEventListener("scroll", function(event) {
  if(this.scrollY != 0) {
  document.getElementById('nav').style.background = "#fff";
  }
  else {
  document.getElementById('nav').style.background = "transparent";
  }
});

将您的 id 用于具有颜色属性而不是 nav 的导航栏，我也使用 0 作为默认值，但您可以根据内容开始之前拥有的任何填充或边距来更改值

推荐阅读