jquery – 如何在向下滚动时构建浮动菜单栏

当我向下滚动网站显示黑色菜单栏在顶部看起来像浮动吧。
但我认为这是jquery。我已经尝试了CSS,但似乎不像我想要的那样为我工作
#menucontainer {
    position:fixed;
    top:0;
    height: 250px
}

#firstElement {
    margin-top: 250px
}

这是网站的基本想法,我希望菜单如下所示:

http://avathemes.com/WP/Hexic/

解决方法

将您的菜单包装在带有ID或类的div或部分。
#yourID.fixed {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    border-bottom: 5px solid #ffffff;
}

//STICKY NAV
$(document).ready(function () {  
  var top = $('#yourID').offset().top - parseFloat($('#yourID').css('marginTop').replace(/auto/,100));
  $(window).scroll(function (event) {
    // what the y position of the scroll is
    var y = $(this).scrollTop();

    // whether that's below the form
    if (y >= top) {
      // if so,ad the fixed class
      $('#yourID').addClass('fixed');
    } else {
      // otherwise remove it
      $('#yourID').removeClass('fixed');
    }
  });
});

不记得我从哪里得到了,所以没有对我的赞美,但它对我有用。

相关文章

页面搜索关键词突出 // 页面搜索关键词突出 $(function () {...
jQuery实时显示日期、时间 html: <span id=&quot...
jQuery 添加水印 <script src="../../../.....
中文:Sys.WebForms.PageRequestManagerParserErrorExceptio...
1. 用Response.Write方法 代码如下: Response.Write(&q...
Jquery实现按钮点击遮罩加载,处理完后恢复 思路: 1.点击按...