修改＃鏈接的偏移量？

我有一個固定的頂部欄 - 所以如果你點擊一個內部鏈接（<a href="#xxx">）它會變得模糊。有什麼辦法讓我強制（通過Jquery/JS），以便任何#xxx鏈接自動偏移Z像素？修改＃鏈接的偏移量？

按照要求，例如鏈接：http://examine.com/supplements/Creatine/#ref32

來源

2012-03-15 Sol Orwell

我們需要您的相關HTML和CSS，才能幫助您。請閱讀常見問題解答：http://stackoverflow.com/faq – Brad 2012-03-15 16:59:16

按要求添加。 – 2012-03-15 20:28:43

最好通過html/css更改來處理，而不是使用javascript來糾正問題。將您的內容放置在頁面頂部帶有頁邊距的可滾動div中，作爲固定內容的佔位符。如果你發佈你的html，那麼可以給出更具體的建議。

下面是一個例子：

http://jsfiddle.net/mrtsherman/CsJ3Y/3/

body { overflow: hidden; } 
#header { position: fixed; top: 0; left: 0; width: 100%; height: 50px; background: gray; border: 1px solid black; } 
#content { 
    overflow: scroll; 
    position: absolute; 
    top: 50px; 
    bottom: 0px; 
    width: 100%; 
    border: 1px solid blue; 
}

HTML

<div id="header">header</div> 
<div id="content"> 
    <div> 
     Page Content <br /> 
     <a id="a1" href="#anchor2" name="anchor1">Anchor 1</a>     
     <a id="a2" href="#anchor1" name="anchor2">Anchor 2</a> 
    </div> 
</div>

來源

2012-03-15 17:13:32 mrtsherman

添加了一個鏈接 - 需要修改點擊的JS行爲。 – 2012-03-19 18:21:41

@SolOrwell - 錨不是JavaScript。所以你不能修改他們的行爲。通過javascript導航後，您可以滾動到其他位置，但這是解決此問題的錯誤方法。通過修復你的html/css來解決它。我的例子是你應該解決這個問題的方式。 – mrtsherman 2012-03-19 19:24:01

喜歡的東西：

$('a[href^=#]').offset({ top: 10, left: 10 });

？

來源

2012-03-15 17:08:45

修改鏈接的顯示。我需要的是，如果點擊它，它會將您帶到的位置，但將它偏移20像素。 – 2012-03-19 18:21:27

因爲我不得不處理這個...

HTML：

<h1><span class="offsetTarget" id="title">&#8203;</span>My Title</h1> 

... 

<a href="#title">This is a link</a>

CSS：

.offsetTarget { position: relative; bottom: 50px; }

50像素的可不管你的酒吧的高度。你需要東西跨度，和（零寬度空間）爲我工作得很好。

來源

2016-06-29 23:42:22

修改＃鏈接的偏移量？

回答

相關問題