Jquery 如何制作粘性菜单？

我如何在这个网站上制作菜单？www.awwwards.com

当用鼠标滚动页面时，菜单将保持在顶部，其颜色也将改变。滚动前和滚动后的菜单具有不同的颜色

我在网上找到了一个教程，但当页面滚动时，它的颜色是一样的。谁能告诉我怎么换颜色吗

.menutext {
  float: left;
  border-bottom:1px solid #d2d6d5;
  width: 100%;
  background:gray; }
.menutext ul {
  margin: 0 0 0 10%; }
.menutext ul li {
  float: left;
  position: relative;
  border-left: none;
  list-style: none; 
}
.menutext li a {
  text-decoration: none;
  color: #444;
  display: inline-block;
  font-size: 14px;
  font-family: MuseoSans, serif;
  text-transform: uppercase;
  padding:10px;
  border-right: 1px solid #d2d6d5;
  text-align: center;
}
.menutext ul li :hover {
  color:#919191;
  background-color: #f4f4f4;
}

js

html

$（窗口）。滚动（函数（）{
如果（$（窗口）.scrollTop（）>20）{
$（“#头”）.addClass（'sticky'）；
}否则{
$（“#头”）。移除类（“粘性”）；
}
});
html，正文{
边距：0；填充：0；
身高：300%；
}
#顶{
高度：20px；
宽度：100%；
}
#头{
宽度：100%；
高度：50px；
背景颜色：灰色；
}
.粘的{
位置：固定；
排名：0；
}

废话
粘性标题
抱歉，这不是Stackoverflow的用途。如果您的实现存在特定问题，请向我们展示您的解决方案。如果您拥有的是（在编写本文时）已经存在的代码，那么您要求我们为您完成这项工作。请阅读帮助中关于“粘性菜单”的部分（可能重复）。关于卷轴上的颜色变化，请在谷歌上查找（上面有很多东西）。@freefaller这只是一个无法帮助的人的原因。@Sufi，无法帮助的人和不想帮助的人之间有很大的区别。我有18年的专业编程经验，我想我属于后一类。现在你已经提供了一些你自己工作的证据，我再看看
$(document).ready(function() {
  // Menentukan elemen yang dijadikan normal yaitu .normal
  var normalNavTop = $('.menutext').offset().top; 
  var normalNav = function(){
    var scrollTop = $(window).scrollTop();  
    // Kondisi jika discroll maka .nav ditambahkan class normal dan sebaliknya      
    if (scrollTop > normalNavTop) { 
        $('.menutext').css({ 'position': 'fixed', 'top':0, 'left':0, 'z-index':9999 });
    } else {
      $('.menutext').css({ 'position': 'relative' });
    }
  };

  // Jalankan fungsi
  normalNav();
  $(window).scroll(function() {
    normalNav();
  });
});

<div id="menu">
<div class="menutext">
    <ul>
        <li><a href="#">home</a>
        </li>
        <li><a href="#">about</a>
        </li>
        <li><a href="#">product</a>
        </li>
    </ul>
</div>