Answers for "how to make navbar change background color when scroll in css"

on scroll change navbar color

$(document).ready(function(){
    $(window).scroll(function(){
        if($(window).scrollTop() > $(window).height()){
            $(".menu").css({"background-color":"transparent"});   
        }
        else{
            $(".menu").css({"background-color":"white"});
        }

    })
})

navbar background color css

<!-- Navbar text is dark and background is light -->
	<nav class="navbar navbar-light bg-light">
        <a class="navbar-brand" href="#">
          Light color background
      </a>
    </nav>
  
    <nav class="navbar navbar-light bg-warning">
        <a class="navbar-brand" href="#">
          Warning color background
      </a>
    </nav>
  
<!-- Navbar text is light and background is dark -->
    <nav class="navbar navbar-dark bg-dark">
        <a class="navbar-brand" href="#">
          Dark color background
      </a>
    </nav>
  
<!-- Similarly... -->
    <nav class="navbar navbar-dark bg-primary">
        <a class="navbar-brand" href="#">
          Primary color background
      </a>
    </nav>
  
    <nav class="navbar navbar-dark bg-secondary">
        <a class="navbar-brand" href="#">
          Secondary color background
      </a>
    </nav>
  
    <nav class="navbar navbar-dark bg-success">
        <a class="navbar-brand" href="#">
          Success color background
      </a>
    </nav>