Html 引导透明菜单

我想让我的引导菜单有一个透明的背景。滚动后，将颜色更改为灰色。我尝试了我在这里看到的一切，但迄今为止没有成功

这是我的密码：

<nav class="navbar  transparent navbar-inverse navbar-fixed-top">
<div class="container-fluid">
<div class="navbar-header">
  <button type="button" class="navbar-toggle" data-toggle="collapse" 
    data-target="#myNavbar">
    <span class="icon-bar"></span>
    <span class="icon-bar"></span>
    <span class="icon-bar"></span>                        
  </button>
  <a class="navbar-brand" href="#">WebSiteName</a>
</div>
<div class="collapse navbar-collapse" id="myNavbar">
  <ul class="nav navbar-nav">
    <li class="active"><a href="#">Home</a></li>
    <li class="dropdown">
      <a class="dropdown-toggle" data-toggle="dropdown" href="#">Page 1 
     <span class="caret"></span></a>
      <ul class="dropdown-menu">
        <li><a href="#">Page 1-1</a></li>
        <li><a href="#">Page 1-2</a></li>
        <li><a href="#">Page 1-3</a></li>
      </ul>
    </li>
    <li><a href="#">Page 2</a></li>
    <li><a href="#">Page 3</a></li>
  </ul>
  <ul class="nav navbar-nav navbar-right">
    <li><a href="#"><span class="glyphicon glyphicon-user"></span> Sign Up</a></li>
    <li><a href="#"><span class="glyphicon glyphicon-log-in"></span> Login</a></li>
  </ul>
</div>

---

如果这是您要找的，请告诉我

$（文档）.ready（函数（）{
$（窗口）。滚动（函数（）{
var scroll=$（窗口）.scrollTop（）；
如果（滚动>10）{
$（“.transparent”）.css（“背景”、“灰色”）；
}否则{
$（“.transparent”）.css（“背景”、“透明”）；
}
})
})

正文{
保证金：0；
填充：0；
高度：1000px；
}
.透明{
位置：固定；
排名：0；
背景：透明；
宽度：100%；
高度：50px；
}
.透明ul{
列表样式类型：无；
填充：0；
}
.李先生{
显示：内联块；
宽度：100px；
颜色：红色；
}
格雷先生{
位置：固定；
排名：0；
背景：#333；
宽度：100%；
高度：50px；
}

它现在做什么？请提供带黑色背景的.standart bootsrapt菜单。请确保问题本身有完整的示例。使用链接编辑问题。谢谢OMG工作正常，但加载页面时颜色为黑色，滚动后颜色和透明度发生变化。但我想我可以编辑它。是的，我知道它，很容易修复，而且我一到家就会修复。我想这只是一个片段在做这件事。检查这些，然后检查。如果你有问题，请告诉我。