Question

我在滚动时使用自举导航栏将jquery的背景颜色更改为红色，并且它不起任何帮助。

HTML CODE

<header class="navbar navbar-default navbar-fixed-top" style="background-color:Transparent; border-color:#e74c3c;">
      <div class="navbar-brand" style="color:white;">Podlle</div>
      <div class="nabar-item">
         <a style="color:white;" href="#"<div class="navbar-text">Sign Up</div></a>
         <a style="color:white;" href="#"<div class="navbar-text">Log In</div></a>
      </div>

Jquery代码

<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.4.js">
$(document).scroll(function(){
  $(".navbar").css("background-color" , "red");  
})

请帮助，谢谢

Answer 1

您需要等待文档存在（DOM Ready），然后对其执行任何操作。使用jQuery，您可以使用快捷方式$(callbackFuncion)。

来实现

以下是我编写的示例代码，当页面滚动并使用类nav-bar更新元素时将打印到控制台以获得红色背景：

$(function () { // This will wait for DOMReady
  $(document).on('scroll', function () {
    console.log("Scrolling.");
    $('.nav-bar').css('background-color', 'red');
  });
});

这是一个完整的示例代码：http://jsfiddle.net/xa8doyb4/

更改引导程序导航栏滚动效果

1 个答案: