Anchor Offset for Fixed Header (with Scroll)

A fixed header can cause auto-scroll content to be covered. Use this function to offset the scroll to the height of the fixed container.

REL.init = function() {
	jQuery(window).on('hashchange load', function() {
REL.adjustAnchor = function() {

    var jQueryanchor = jQuery(':target'),
            fixedElementHeight = jQuery('#masthead').outerHeight(); // change to ID or Class of fixed header

    if (jQueryanchor.length > 0) {

        jQuery('html, body')
                scrollTop: jQueryanchor.offset().top - fixedElementHeight
            }, 200);




Leave a Reply

katherine as a flat graphic icon

About Me

I’m an African / Ojibwe First Nations Web Developer living in Winnipeg, Manitoba.

Visit the Tips and Blog to see what I’m working on.