Archived topic
Smooth Scroll Accuracy
8 replies · Started by jm1991 on June 11, 2020
Hi there,
I think because I lazy load my videos, it disrupts the functionality of smooth scroll and causes it to be inaccurate,
I've tried slowing down the smooth scroll speed and that's helped to a degree, but I'm not sure if there is something else I can do?
Click the last few anchor links on the example URL to see what I mean
Hi there,
You may want to try a different lazy loader - one that adds a correct size placeholder. This should correct the issue with smooth scroll and stop the Layout Shifting ( which Google is now getting all uppety about )
Do you guys have any recomended plugins?
We don't really use Lazyloaders.
I believe the one built in to Autoptimize uses correct size placeholders - although i am not sure about Videos. Might be worth a shot.
There seems to be a real lack of lazy loading plugins for self-hosted videos. And the ones available are not great, they all seem to have that janky UX.
I've had to disable the smooth scroll feature unfortunately, as it just doesn't work with lazy load plugins.
Questions:
1. Are there plans to add the class="lazy" attribute as default in the GeneratePress theme? Would be a serious asset and given the ethos of optimised performance, would be a perfect addition. Probably one of the biggest performance enhancers left untapped?
2. the Sticky Nav seems to get in the way of the current anchor link end point. Is there some CSS to stop that from happening, or is this still down to the lazy load implementation? (smooth scroll is disabled)
I haven't done a lot of tests but maybe try adding a Poster Image to your videos. This may give more scope to which lazy loaders work effetively.
1. The class="lazy" doesn't do anything in itself as WordPress has yet to add its own lazy loading functions.
2. Its the Smooth Scroll functions that offsets the sticky navigation height.
Oh interesting, I thought that class works natively in Chrome of you add it.
Chromes lazy loading function using the loading="lazy" attribute is readily available.
But its only for Chrome. Whereas i think most users would expect this across all browsers.
In addition WP is working on a core lazy load function which would make anything we did a possible redundancy. They have released it as a feature plugin to trial before it goes to core:
Right! Sorry my bad for mixing up "lazy"
