滚动条位置

Question

单击我想将滚动条定位到特定的div。我用这个代码：

<a href="#sponsor">Go to Sponsor</a> 
... 
<div id="sponsor">Sponsor</div> 

的问题是，我的头是固定的（随高度50像素）和重叠的div＃赞助商本身。

这里http://jsfiddle.net/xqZ9y/

看看怎么解决？

谢谢。

Answer 1

可以通过添加额外的元件绕过问题，用#sponsor

<span id="sponsor"></span> 

#sponsor { 
    width: 0; 
    height: 0; 
    position: relative: 
    top: 50px; 
} 

Answer 2

正确定位的问题是，一个标准的锚将带你到目标通过设置的所述scrollTop的文档是目标的偏移顶部。在你的情况下，这意味着该物品位于标题后面。解决这个问题的一种方法是覆盖锚定点击事件，以补偿项目重新定位时的标题高度。

下面是一些jQuery的，将做到这一点...

$(function(){ 
    $("a[href^='#']").on("click.scrollFix", function(e) { 
     // cancel the click of the a href from taking you to the 
     // anchor by normal means 
     e.preventDefault();   

     // instead find the element and scroll to the elements position - the height of the  header 
     var targetSelector = $(this).attr("href"), 
      targetTop = $(targetSelector).offset().top, 
      headerHeight = $("#header").outerHeight(true); 

     $(document).scrollTop(targetTop - headerHeight); 
    }); 
}); 

，这里是使用固定头和一些垃圾内容:)

http://jsfiddle.net/QjheK/