CODEWITHSUNDEEP
jqueryhtmlcssanchoroffset
erkor
erkor

Reputation: 67

Anchor offset isn't working

I made a page with a fixed header, where I want to use smooth scrolling (jQuery). Because of the fixed header I need to add an offset to my anchor links.

http://jsfiddle.net/Lt4s390e/

I tried setting the anchors like this

<a id="top" class="anchor"></a>

and then adding a CSS class

a.anchor {
    display: block;
    top: -110px;
    height: 110px;
    visibility: hidden;
    position: relative;
}

Somehow this doesn't work for me and I have no idea why.

Upvotes: 0

Views: 114

Answers (2)

erkor
erkor

Reputation: 67

I found a solution using CSS. I had to set my anchors like this

<div class="anchor"><span id="section1"></span></div>

and define them in my CSS like this

.anchor{            position: relative;}

.anchor span{       margin-top: -110px;
                    padding-bottom: 110px;
                    display: block;}

Upvotes: 0

frontend_dev
frontend_dev

Reputation: 1719

You could try this:

'scrollTop': $target.offset().top - 100

That seems to get the desird result.

Upvotes: 1

Related Questions