Anchors going to wrong position with lazy load

  • Resolved fabiomasarin

    (@fabiomasarin)


    5 years, 1 month ago

    Hello, I’m using lazy load plugin since a while and I’m quite satisfied.
    There’s still a problem in my environment that I still can’t solve: almost all the webpages of my website have a Table of contents with some anchor links that directly bring to the specific paragraph in the text.

    When Lazy load plugin is enabled, clicking anchors on any page with any browser bring the page to the wrong position (often about 100px further than the correct point); disabling the plugin everything works correctly.

    I guess that’s because images before loading are not the same size like after load so that bring to a wrong position, so I would like to ask you if there’s any way to solve this, maybe placing an “empty” space with the same size of the pictures before lazy loading happens, or some other options.

    Above you can find an example page of the website with the table of content with about 20 links in the yellow box not far from the beginning of the page.

    thanks,
    best regards

    The page I need help with: [log in to see the link]

Viewing 2 replies - 1 through 2 (of 2 total)
  • Plugin Author Steve Truman

    (@a3rev)

    5 years, 1 month ago

    @fabiomasarin

    Thanks for the link – I see what you are saying on the first load when click on an anchor links when:

    1. First Click to anchor position
    2. IF anchor before has and image (that has not yet been lazy loaded.

    Then yes when the image loads (off screen) – then it will push down the content when it loads. This is because you content position is dynamic.

    As you mentioned – It is not possible to set the Lazy Load place marker as the size of the original image because the original image load size is determined by browser depending on the width of the device that it is being viewed in – After the Lazy Load has occurred. The a3 Lazy Load place marker is loaded first and then the browser calculates the size of the actual image and loads it.

    After the first clicking on an anchor link all of the images above the anchor are loaded OFF screen – so you don’t see the issue again when using the anchor links to view content.

    If the anchor entry before does not have an image then you don’t see the issue at all.

    I have had a look at the page that you linked to and except as described on first load when the entry above has an image it works perfect – I made a screenshot video of the way it is showing on my test.

    Steve

    Thread Starter fabiomasarin

    (@fabiomasarin)

    5 years ago

    Hello,
    thanks for your message,
    yes I experimented the same behaviour you described, after the first click/scroll the images are loaded and the next clicks are working correctly.

    But anyway that doesn’t solve the problem that is still there.
    I can’t obviously tell to the visitors “first click a random link then go back on top and continue browsing”: it happens that visitor are searching for a specific subtopic, they click it, they don’t find it because of the wrong offset (depending on the size of the screen it can be wider than in the screenshot video) and they leave.

    So if I understand correctly there is no solution to this issue?

    thanks,
    best regards

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Anchors going to wrong position with lazy load’ is closed to new replies.

Tags