在滚动后更改导航栏颜色？ [英] Changing nav-bar color after scrolling?

问题描述

如何设置没有背景颜色的导航栏？

How can I set the navbar with no background color?

当在div后向下滚动时，导航栏会获得新的背景颜色应该固定在顶部，我在Bootstrap中使用 navbar-fixed-top ）

When scrolling down after a div the nav-bar gets a new background-color (the nav-bar should be fixed at top, I use navbar-fixed-top in Bootstrap)

但我没有成功。

这是网站： http：// attafothman。

This is the website : http://attafothman.olympe.in/
I'm talking about that black nav-bar on top.

推荐答案

以下是 jsfiddle示例。使用Jquery基于滚动像素位置更改背景颜色。

Here is a jsfiddle example. Using Jquery to change the background color based on scroll pixel position.

以下是使用引导程序的小提琴

Here is a fiddle using bootstrap

$(document).ready(function(){       
   var scroll_start = 0;
   var startchange = $('#startchange');
   var offset = startchange.offset();
    if (startchange.length){
   $(document).scroll(function() { 
      scroll_start = $(this).scrollTop();
      if(scroll_start > offset.top) {
          $(".navbar-default").css('background-color', '#f0f0f0');
       } else {
          $('.navbar-default').css('background-color', 'transparent');
       }
   });
    }
});

这篇关于在滚动后更改导航栏颜色？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！