在Apple iphone 5c页面中滚动时使导航栏向下滑动

Question

我正在开发一个基于Bootstrap 3的网页，我喜欢让我的导航栏向下滑动，就像在Apple iPhone 5c Page中向下滚动一样，（ havbar应该首先隐藏）我和＃39;，不是js的专家，对此有任何帮助将受到高度赞赏。 提前谢谢。

听到的是我创建的示例代码。 CODE

Answer 1

您必须指定窗口的scroll事件：

$(window).scroll(function(e){
    // here the bar is id'ed myBar
    if ($(this).scrollTop() > 30) { // choose the value you want.
        $('#myBar:hidden').slideDown();
    } else {
        $('#myBar:visible').slideUp();
    }
});

确保CSS正确：position:fixed，依此类推......

这是Fiddle