Question

基本上我有一个带有导航的固定标题，它始终附在窗口的顶部。然后我有另一个固定的元素，它是一个分页，但是当它滚动到它时它只会将它自己附加到窗口的顶部！

此分页具有链接到页面上不同部分的锚链接！但是，当您单击链接时，它会覆盖固定浮动元素的内容。

以下是示例：http://www.chudz.co.uk/test/

如果向下滚动，您会看到分页附加到标题导航！然后，如果您在分页中单击“A”，您将看到会发生什么！内容被覆盖！（A是对不起的唯一链接。）

任何人都知道我可以使用的解决方案吗？

由于

Answer 1

你的固定分页不占用dom中的任何空间。

你应该使用'id'而不是'name'，然后在锚中添加一个类，绝对定位它并向上移动一个负边距（与分页的高度相同）。这将确保锚点在分页下方开始。

Answer 2

这是JavaScript解决此问题的方法。首先，将head属性中的name属性更改为id属性。

<h2><a id="a">Authors - A</a></h2>

然后将此脚本添加到底部脚本中。

$(document).ready(function(){
    $("#pagination a").click(function(event){ 
        event.preventDefault();
        var o =  $( $(this).attr("href") ).offset();   
        var sT = o.top - 151; // 151 is the header height + navigation height 
        window.scrollTo(0,sT);
    });
});

具有两个固定导航的锚链接 - 复杂

2 个答案: