Page Scroll to ID Offset not working right

  • Malihu, I have been scratching my head with this one problem for quite a few days now : I set a 70 pixels offset to properly show the desired element with its title , but this offset is not applied when you click on the link of the element the first time, it is applied only after the sencond click. For example, when the page is loaded for the first time or reloaded the offset value does not apply but after that from the second click onwards it starts working.

    I am using the GeneratePress Theme.

    Do you have an idea of the reason?
    Thank you, would really appreciate any help.
    Regards
    D

Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Author malihu

    (@malihu)

    I can’t really say for sure (without seeing your page) but what you describe sounds like the document/body length changing while you scroll down the page.

    Do you have a sticky header? Does the offset work correctly (even on the first time) when you’ve already scrolled down the page?

    I’d be able to provide more help if I could see you page. Can you post your site’s url?

    Thread Starter dgops

    (@dgops)

    Sure. Thanks for the prompt response.

    the url is https://cysecon.com

    I am using a sticky header.

    the offset does not work correctly the first time (every time it is reloaded) whether i manually scroll down or not. after that it works just fine.

    Regards
    D

    Plugin Author malihu

    (@malihu)

    I just checked your page.

    You seem to be using a lazy-load script on your images which affects elements position and page scrolling.
    The issue you’re having comes from the fact that the images are loaded while the page is scrolling (due to the lazy-load script) and since some of these images do not have a fixed height, they extend the page/document length after they’re loaded.

    So, when you click a link at the top the page starts scrolling to the target position, but by the time it arrives there, the target’s position has changed because other images have loaded above it.

    This is a general problem with lazy-loading images and in-page anchors and affects all pages, meaning that the issue will remain with or without “Page scroll to id” plugin.

    The only way to fix this is either by removing the lazy loading script or setting a fixed/correct height on your image placeholders (although this might affect layout responsiveness).

    Hope this helps.

    Thread Starter dgops

    (@dgops)

    Thank you sir. That was very helpful information.

    I will try to play around with Lazy load to see if I can make the two work together. Unfortunately cannot get rid of lazy load as it has been very efficient in improving my page load speed.

    Hopefully there is way to make them co-exist.

    Thanks
    Regards
    D

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Page Scroll to ID Offset not working right’ is closed to new replies.

Tags