jQuery單頁滾動錯誤的地方

Question

在我的單頁網站http://s361608839.websitehome.co.uk/pt-build/templatebuild/如果您點擊頂部菜單選項，頁面會滾動到頁面上的每個部分。

問題當它滾動時，頁面的頂部覆蓋了部分的頂部。

有什麼我可以做我的CSS來阻止這種情況發生？

謝謝。

Answer 1

用填充替換一些邊距。當把頁面跳轉到這樣的錨點時，它會跳到內框的邊緣，填充之外和邊界/邊界之內。你需要做的是將該虛擬線從div內的內容移開，因此增加填充並減少一些邊距以保持設計正常工作。

我做了一些與您的網站打轉轉，修改，看看它是如何爲你的trainingsessions節時，我得到這個CSS：

margin-top: 0; 
padding: 120px 350px 30px 0; 

Answer 2

要使用純CSS調整，添加一個額外的151px（中您的#topwrap元素的高度）到每個可導航div的padding-top。然後從前面導航div的margin-bottom減去151px。

這方面的一個簡化版本（你需要做數學題，使其與您現有的邊距和補工作）會是什麼樣子：

#div1 { /* first navigable div */ 
    margin-bottom: -151px; 
} 
#div2 { /* all intermediate navigable divs */ 
    padding-top: 151px; 
    margin-bottom: -151px; 
} 
#div3 { /* last navigable div */ 
    padding-top: 151px; 
} 

或者，你可以調整滾動位置由151px高度的#topwrap的JavaScript。