Hi and thanks for the fast response. Surely the JS can check the height of the sticky header instead of being set in stone? All your theme users must therefore have this issue?

This is not so great when I process ALL theme updates and will need to do this every time.

How do other themes do it? I know that The7 theme calculates it… below:

/*!-scroll to anchor*/
window.clickAnchorLink = function( $a, e ) {
var url = $a.attr( ‘href’ ),
hash = url,
$target = url.substring(3),
base_speed = 600,
speed = base_speed;
if(url.match(“^#!”)){
var $target = url.substring(3);
}else{
var $target = (url.substring(url.indexOf(‘#’))).substring(3);
}

set_sticky_header_height();

if ( typeof $target != ‘undefined’ && $target && $target.length > 0 ) {
location.hash = url;
if($(“#” + $target).length > 0) {
var top = $(“#” + $target).offset().top + 1,
this_offset = $a.offset(),
that_offset = $(“#” + $target).offset(),
offset_diff = Math.abs(that_offset.top – this_offset.top),
speed = 150 * Math.log(offset_diff^2/1000 + 1.02);
$newScrollPosition = top – floatMenuH;
};
if($target == “up”) {
if($body.hasClass(“overlay-navigation”)){
$.closeMobileHeader();
$.closeSideHeader();
$moveBody.stop().animate({
scrollTop: top – floatMenuH
}, speed, ‘swing’);
}else{
$.closeMobileHeader();
$moveBody.stop().animate({
scrollTop: 0
}, speed, ‘swing’,
function() { $.closeSideHeader(); }
);
}
}else {
if($body.hasClass(“overlay-navigation”)){
$.closeMobileHeader();
$.closeSideHeader();
$moveBody.stop().animate({
scrollTop: top – floatMenuH
}, speed, ‘swing’,
function() {
if(window.innerWidth < dtLocal.themeSettings.mobileHeader.firstSwitchPoint && !$body.hasClass(“responsive-off”)){
if(stickyMobileHeader){
if(mobileHeaderDocked){
$newScrollPosition = ( top – $(“.masthead-mobile-header .mobile-header-bar”).height() )
}else{
$newScrollPosition = ( top – $($headerBar, $phantom).height() );
}

$moveBody.stop().animate({
scrollTop: $newScrollPosition
}, 650, ‘swing’);

}
}else{
if(sideHeaderHStrokeExists){
$newScrollPosition = ( top – $(“.sticky-top-line”).height() )

$moveBody.stop().animate({
scrollTop: $newScrollPosition
}, 650, ‘swing’);

}
}

});

Any help is greatly welcomed. Thanks!