• Resolved shaunbowen

    (@shaunbowen)


    Hi there, I am having an issue with the scroll overshooting when accessing anchor links from different pages.

    I followed the tips listed here: https://wordpress.org/support/topic/scroll-overshooting-from-other-pages/ and unfortunately it didn’t help (apart from scrolling back up to the right place after it overshoots).

    The issue only occurs if I use the SiteOrigin widget called “Simple Masonry Layout” from the SiteOrigin Widgets Bundle.

    I tried using the ‘preloader’ image option in the widget, but this also didn’t help. Any ideas?

    Additional Note: The page seems to scroll all the way to the bottom first, regardless of the position of the anchor link.

    • This topic was modified 3 months, 4 weeks ago by shaunbowen.

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

Viewing 6 replies - 1 through 6 (of 6 total)
  • Thread Starter shaunbowen

    (@shaunbowen)

    I think I have managed to sort a workaround by specifying a fixed height for the Simple Masonry Widget in my CSS, but I will need to adjust this for all screen sizes, as the widget size is dynamic.

    Plugin Author malihu

    (@malihu)

    Hello,

    This sounds normal, as not having a fixed height will overshoot page scroll (this will happen with or without the plugin). Although I’m not sure which page to check in your site(?)

    Thread Starter shaunbowen

    (@shaunbowen)

    Hi @malihu I have added a couple of test pages so you can see the behaviour.

    Go to /link-test/ then click on the link. It will go to /home-test/ and attempt to scroll to the ‘About Me’ section.

    You’ll see instead that the page scrolls right to the bottom, then back up.

    If it was just the height of the masonry widget, it would only overshoot by 735px, but it keeps going.

    I’m guessing the overshoot amount is probably the combined height of all the masonry items stacked vertically, as when I extend the page height a lot, the scroll then doesn’t go all the way to the bottom.

    Plugin Author malihu

    (@malihu)

    Indeed, it’ll overshoot the amount of images stacked on top of each other, before masonry does its thing. The only way to overcome this (since you already have plugin’s options to auto-correct scroll enabled) is exactly what you did, i.e. set a height value for the masonry container.

    Keep in mind that this will happen with or without smooth scrolling.

    You could also try to give a small delay when scrolling from/to different pages and see if it fixes the issue without having to set a fixed height (this depends on how the masonry script works):

    Go to plugin settings and set a value like 500 to “delay for scrolling to target on page load” field. Save changes and test with/without the fixed height.

    Thread Starter shaunbowen

    (@shaunbowen)

    @malihu you’re a genius!

    Simply adding a small delay of 100ms when the page loads has sorted the issue. Much better than adding CSS heights for each screen size.

    I’ll mark this as resolved, thanks for your help.

    Plugin Author malihu

    (@malihu)

    Awesome, Glad I helped 🙂

Viewing 6 replies - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.