I have navbar button which should lead to contact section on every page.
I gave section ID, and assigned button with “#contact” URL, but on first click on homepage, and B2B page it leads to half of page, or on top of section above, and there it stops.
On second clicks it leads to contact section well, but first click not working.
Also, sometimes if you reload page it leads you well on first click, but not everytime.
I tried making many scripts, tried to make JS code which subtracts page height from footer section (only section below contact section), and make window to scroll to the number of px it get but stays same.
Really weird issue, I tried changing button, I tried using link block, but everytime same issue. Do anyone know how it can be fixed?
The browser determines the position to scroll to based on its layout calculations.
If you have lazy-load images above the scroll-to position, which are un-sized, then the browser has no idea how big they are until they load.
So the first time it scrolls to that position, but the scrolling causes the lazy load images to load which pushes that scroll-to position further down the page.
Main options;
Set your images above that point to eager load, OR
Give all of your images sizes
Not that anything that interferes with page height and layout on scroll can have this effect, so check any scroll-triggered interactions too for layout impacts.