Question

好的，我的问题是我有一个固定的导航栏占据屏幕顶部115个像素的空间。当您滚动“到”某个部分时，固定栏将覆盖该部分的一部分。我需要它做的是滚动大约130像素（导航条115像素和一点额外的空间，因此它看起来不太局促）在它应该滚动的部分上方。

我set up a quick and dirty JSFiddle所以你可以得到这个想法。

我认为我应该在此使用偏移或结束，但它们似乎没有做任何事情：

$('#navigation a').click(function(){//$.scrollTo works EXACTLY the same way, but scrolls the whole screen
$.scrollTo( this.hash, 1500, {easing:'elasout'});
});

Here是我从中获取脚本的地方，以及可能对您有所帮助的示例。

我还希望消除附加到网址的#hash链接，以免淹没后面的历史记录。由于导航栏已修复，因此您无需使用它们，只需单击导航栏上的新链接即可访问该站点的任何部分。但这不是主要问题。

感谢帮助。

Answer 1

快速举例！注意：不使用示例中的插件 - 仅在Firefox＆amp;铬

DEMO：http://jsfiddle.net/6DTLc/4/

  $('ul#navigation').find('a').on('click', function(e) {
      var
      link_href =  $(this).attr('href'),   
      $linkElem =  $(link_href),
      $linkElem_scroll = $linkElem.get(0) && $linkElem.position().top-115;           

      $('html, body')
          .animate({scrollTop: $linkElem_scroll}, 'slow');         

        e.preventDefault();
    });

ScrollTo ...如何滚动到＃上方的一定数量的像素？

1 个答案: