Anchor Tag slider issue

hello, I am using an anchor tag that goes to the homepage to a specific section. When I click on this anchor tag from the homepage itself, it works correctly. When i use the anchor tag from another page, it scrolls past that section a bit.

I tested it out that when i comment out the flickity code that i am using for a slider, then my anchor tag works. This is the anchor tag code on another page, and this is the flickity code on the homepage. Is there something else I should be doing? I tried to change the window on load to document.ready but that did not make a difference. Anyone encounter something like this?

$(window).on("load", function () {
$(".flickity-container-banner").flickity({
'fade': true,
wrapAround: true,
friction: 0.35,
'autoPlay': 4000,
pauseAutoPlayOnHover: false,
// arrowShape: {
// x0: 30,
// x1: 50, y1: 50,
// x2: 55, y2: 45,
// x3: 40
// }
});
});

Start by reproducing the cross-page anchor navigation to index.html#contact-us with the Flickity initialization enabled, then compare it with the homepage navigation and with the initialization commented out. Inspect the supplied anchor and window-load Flickity setup for when layout changes affect the target offset. Done means the link lands on the contact-us section consistently from another page while the slider remains enabled.

Written by the indexing model from the issue text.