锚链接到一个位于页面的位置

时间:2014-04-23 04:38:17

标签: javascript

我在页面中使用了四个标签。每个标签部分内容都位于页面底部

Header - style(fixed & height)
tabs(4) - tabTitle

tabContant1
tabContant2
tabContant3
tabContant4

由id定义的每个标签,当我点击tabTitle时,它会转到同一页面中的相应内容部分。

问题是,

例如,当我单击tabTitle2时,tab2Conetent将进入页眉中的页面顶部。 同时,我的页面标题已修复,因此tab2Content隐藏标题后面的一些部分 如何将内容置于固定标题

下方

1 个答案:

答案 0 :(得分:0)

您可以使用jQuery来定义页面的确切位置,以下是如何使其工作的示例:

jQuery scroll to element

或者,如果您只想使用HTML,则可以放置一个文档内锚点,例如:

<div>
    <a name="MyStopOne"></a>
</div>
<div style="margin-top:20px;">
    My Content Part One
</div>

然后使用HTML链接到它,如下:

<a href="#MyStopOne">Jump to Stop One</a>

注意style =“margin-top”,它为您提供了一种方法来填充您跳转到的位置和实际内容之间的间距,克服了静态标头在跳转时隐藏部分内容的问题