如何在我的“粘性”导航上设置偏移量？

我的网站上有65px高的固定标题。我有一个大约3/4的辅助导航，我想在我的头部滚动到底部时修复它。如何在我的“粘性”导航上设置偏移量？

我已经使用Josh Lee's answer on this post来获得功能，但是，由于我的标题是固定的，所以二级导航会滚动到它的右侧，一旦碰到页面的顶部就会固定。

由于它完全绕过我的标题，我怎样才能为触发器设置一个偏移量，使它从屏幕顶部出现65px？

在我<head>：

<script> 
function moveScroller() { 
    var move = function() { 
     var st = $(window).scrollTop(); 
     var ot = $("#scroller-anchor").offset().top; 
     var s = $("#mydiv"); 
     if(st > ot) { 
      s.css({ 
       position: "fixed", 
       top: "65px" 
      }); 
     } else { 
      if(st <= ot) { 
       s.css({ 
        position: "relative", 
        top: "" 
       }); 
      } 
     } 
    }; 
    $(window).scroll(move); 
    move(); 
} 
</script>

在我的网页：

<div id="scroller-anchor"></div> 
<div id="mydiv" class=""> 
    <ul class="wrap"> 
     <li> ... </li> 
     <li> ... </li> 
     <li> ... </li> 
     <li> ... </li> 
    </ul> 
</div> 
<script type="text/javascript"> 
    $(function() { 
    moveScroller(); 
    }); 
</script>

来源

2015-01-15 Paul Ruocco

我相信你会需要考虑的空间，当你正在检查时，改变位置固定，例如改变不可变为

var ot = $("#scroller-anchor").offset().top - 65;

来源

2015-01-15 19:40:58

我们在同一时间评论：D - 我假设这和我的回答完全相同。尝试了它，它的工作原理。谢谢！ – 2015-01-15 19:45:15

我不知道这是否可以被认为是“正确”的方式解决了我的问题，但它似乎对我有效......我将top:-65px添加到scroller-anchor元素。

<div id="scroller-anchor" style="top: -65px;"></div>

来源

2015-01-15 19:43:20

这实际上是将您的Scroller锚定在页面上方65px，通过将-65变量添加-65，脚本只是希望尽快更改位置65px。 – 2015-01-15 19:48:36

如何在我的“粘性”导航上设置偏移量？

回答

相关问题