Javascript 滚动上的jQuery导航栏转换。如何调整特定的过渡点

在我正在构建的站点中，我试图在滚动时使导航栏改变颜色。但是，我不希望它在我开始滚动时就改变颜色。我想要它在一个指定的点，一旦我滚动过去我的jumbotron

到目前为止，我只能通过从顶部滚动来实现。我还没有足够的技能去弄清楚如何通过我页面上的一个特定点来完成它。我非常希望能在这方面得到一些指导

jQuery脚本

---

谢谢你的帮助和指导

有很多方法可以做到这一点。 一种方法是使用纯javascript。 根据需要更改表示滚动条值的changeColorValue

以下是我的建议：

JavaScript:

var changeColorValue = 50;
window.addEventListener("scroll", scrollAnim);
function scrollAnim () {
  var val = getScrollVal();

  if(val > changeColorValue)
  {
    document.getElementById('mynav').style.backgroundColor = 'red';
  }
  else
  {
    document.getElementById('mynav').style.backgroundColor = '#333';
  }
}
function getScrollVal()
{
  var val = $(document).scrollTop();
  return val;
}

var changeColorValue = 50;
window.addEventListener("scroll", scrollAnim);
function scrollAnim () {
  var val = getScrollVal();

  if(val > changeColorValue)
  {
    document.getElementById('mynav').style.backgroundColor = 'red';
  }
  else
  {
    document.getElementById('mynav').style.backgroundColor = '#333';
  }
}
function getScrollVal()
{
  var val = $(document).scrollTop();
  return val;
}