Question

所以我想出了如何修复它等等：

HTML：

<div id="header_nav">
      <nav>
        <ul class="navi">
          <li><a href="">Home</a></li>
... Stack overflow wont let me add more code, but there are more links, etc

JS：

var elementPosition = $('#header_nav').offset();
$(window).scroll(function() {
  if ($(window).scrollTop() > elementPosition.top) {
    $('#header_nav').css('position', 'fixed').css('top', '0');
  } else {
    $('#header_nav').css('position','static');
  }
});

当您将鼠标悬停在每个选项上时，我的导航栏应该具有悬停效果。悬停效果仅在完成向顶部固定的过渡后才起作用。链接也不可点击。我试过玩JS，但我无法弄明白。就像条形图只保存为图像一样，直到你完全向下滚动。

完整代码在此处：http://liveweave.com/XGPWVt

Answer 1

将SELECT . . . FROM (VicDescriptions INNER JOIN VacValues ON VicDescriptions.Vic_Make = VacValues.Vic_Make AND VicDescriptions.Vic_Year = VacValues.Vic_Year ) INNER JOIN VacDescriptions ON VacDescriptions.Period = VacValues.Period AND VacDescriptions.VAC = VacValues.VAC部分移到<div id="wrapper">标记内。

更新示例：http://liveweave.com/aGN9YV

Answer 2

如果您将static更改为relative也适用

我有一个向下滚动固定的导航栏。除非你向下滚动，否则它不起作用

2 个答案: