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(?)
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.
@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.