1

好的,我的问题是我有一个固定的导航栏,在屏幕顶部占据 115 像素的空间。当您滚动“到”某个部分时,固定条将覆盖该部分的一部分。我需要它做的是在它应该滚动到的部分上方滚动大约 130 像素(导航栏为 115 像素,还有一点额外的空间,所以看起来不会太拥挤)。

设置了一个快速而肮脏的 JSFiddle,以便您了解这个想法。

我认为我应该在此使用 offset 或 over ,但它们似乎没有做任何事情:

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

如果它们可以帮助您,这是我从中获取脚本和示例的地方。

我也很想消除附加到 URL 上的 #hash 链接,以免淹没回溯历史。由于导航栏是固定的,因此实际上不需要它们,您只需单击导航上的新链接即可访问网站的任何部分。但这不是主要问题。

感谢帮助。

4

1 回答 1

0

快速示例!注意:不使用您示例中的插件 - 仅在 Firefox 和 Chrome 中测试

演示: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();
    });
于 2012-08-26T05:43:54.227 回答