Anchor link offset

I’m trying to setup a few internal page anchor links and I can’t seem to get the content to sit below the menu bar once clicked.

Under custom CSS I have -

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

I’ve set the section class to ‘anchor’. I’m using IDs to do the jump which are functioning as intended I just can’t seem to get that padding to work.

Any ideas? (please see the hidden note)

Hello @mhkatz,

Thanks for asking. :slight_smile:

Can you please elaborate the changes you are trying to make? Also I am not quite sure as to why you have Hidden the Visibility Anchor class. Please elaborate the query, if possible using some screenshots so we can have a better understanding of the situation.

Thanks.

I just copied various code I found around the internet. I don’t know what I’m doing really :slight_smile:

I will add a couple of screenshots in a secure note. If you click on ‘anchor 1’ at the top of the page you will see the jump to the section but the title is then hidden by the menu bar. I need to offset that jump a little so the menu bar doesn’t cover the title once the anchor is clicked.

HI,

To fix it, you can try adding this in Cornerstone > JS

jQuery(document).ready(function ($){
$('a[href*="#"]').off( "click touchstart");
             $('a[href*="#"]').on('touchend click', function(e) {
                href        = $(this).attr('href');
                notComments = href.indexOf('#comments') === -1;
                if ( href !== '#' && notComments ) {
                  var theId = href.split('#').pop();
                  var $el   = $('#' + theId);
                  if ( $el.length > 0 ) {
                    e.preventDefault();
                    
                   
                    $('html, body').animate({
                                scrollTop:   $($el).offset().top -58
                            }, 450);
                      return false;      
                  }
                }
              });

        });


Hope that helps

2 Likes

Works perfectly as far as I can see with the tests I just did. Even got the smooth scrolling animation :slight_smile:

Outstanding support as usual you guys really are the best.

Glad to hear that! Cheers!

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.