Jquery 仅在滚动条上显示持久标题

提前感谢你的帮助

我将下面的DavidWalsh代码片段与jQuery一起使用，以支持一个持久的头divtopbar。但是，我正在试图弄清楚如何让用户滚动至少100px时才显示标题

我尝试添加一个窗口侦听器代码段，但它实际上破坏了持久的头代码段

$(document).ready(function() {
(function() {
    var fadeSpeed = 200, fadeTo = 0.5, topDistance = 30;
    var topbarME = function() { $('#topbar').fadeTo(fadeSpeed,1); }, topbarML = function() { $('#topbar').fadeTo(fadeSpeed,fadeTo); };
    var inside = false;
    $(window).scroll(function() {
        position = $(window).scrollTop();
        if(position > topDistance && !inside) {
            topbarML();
            $('#topbar').bind('mouseenter',topbarME);
            $('#topbar').bind('mouseleave',topbarML);
            inside = true;
        }
        else if (position < topDistance){
            topbarME();
            $('#topbar').unbind('mouseenter',topbarME);
            $('#topbar').unbind('mouseleave',topbarML);
            inside = false;
        }
    });
})();

})

以下是答案：

jQuery(document).ready(function($) {
  var startY= $('#header').position().top + $('#header').outerHeight();
  $(window).scroll(function () {
  if($(this).scrollTop() > startY ){
    $('#topbar').slideDown();
  }else{
    $('#topbar').slideUp();
  }
});

---

请参见“谢谢”，但这根本不是在用户将窗口滚动一定距离后仅显示标题。您确定吗？请参阅itYup末尾的演示，该演示用于修复页面中的元素，以便在滚动时它不会离开屏幕。但是，没关系，我找到了解决办法，谢谢。现在就发布。你应该把你的解决方案写在答案中并接受它

jQuery(document).ready(function($) {
  var startY= $('#header').position().top + $('#header').outerHeight();
  $(window).scroll(function () {
  if($(this).scrollTop() > startY ){
    $('#topbar').slideDown();
  }else{
    $('#topbar').slideUp();
  }
});