鏈接到網頁的特定部分，但在頂部的某個高度

在我的頁面上，我有一個隨用戶的滾動一起移動的靜態標頭。這很好用，但是當我使用標準方法鏈接到頁面上的特定div時，div會在標題後面結束。鏈接到網頁的特定部分，但在頂部的某個高度

基本上我想使用

<a href="#css-tutorials">Cascading Style Sheet Tutorials</a> 
<div name="css-tutorials">CSS Tutorials</div>

，但我怎麼得到它，這樣它不會把DIV在瀏覽器窗口的最頂部？我檢查了一個方法，說添加填充到div的頂部，但這不可能與我的設置。

這裏是生活site。當您點擊大圖片中間藍色欄中的Forms鏈接時，我需要轉到id='Forms' div。

來源

2015-01-07 hassassin96

你可以進一步移動錨點，以便當用戶的土地那裏，目標位置（#forms）仍然低於標題。 – Leighthel

嘗試下面的代碼，動畫播放至該區域當你點擊Forms & FAQs

$('[href="#Forms"]').click(function(e){ 
    e.preventDefault(); 
    $('html,body').animate({scrollTop:$('#Forms').offset().top - $('#siteHeader').height() + 1}) 
})

來源

2015-01-07 05:14:55

感謝您的回覆，我試過但沒有改變。我將上面的代碼粘貼到我的JS文件中，但是當我點擊「Forms＆FAQs」部分時，它只是跳到該區域並且仍然隱藏起來 – hassassin96

我已經在該網站中嘗試了此操作，並且它正在工作..如果您將它粘貼到js文件中，您必須刷新緩存。在控制檯中運行它並查看 –

我在控制檯中嘗試了它，它的工作原理完美無瑕，但它無法從JS文件中運行。我刷新了緩存並從瀏覽器中刪除了所有緩存，但仍然無效。有趣的是，同樣的事情發生在同一個網站的不同頁面上，同時也有一些新添加的代碼。我檢查了周圍，我似乎無法找到一個解決方案 – hassassin96

鏈接到網頁的特定部分，但在頂部的某個高度

回答

相關問題