You’re right, I tried on Safari on my iPhone S6 and iPhone Plus and working fine.
But on Chrome, when scrolling “with finger laying down and up on the screen itself, I feel and see a laggy issue”. Try scrolling by keeping your finger on the screen and you will see it too
But on Chrome, when scrolling “with finger laying down and up on the screen itself, I feel and see a laggy issue”.
I tested this a bit more on Chrome using both Android and iPhone – in both tests the page scrolled smoothly on this end.
I did see a bit of a glitch when scrolling up and down very quickly. However, it looks like this is caused by Chrome’s UI at the top of the viewport moving in and out of view on scroll. I recorded a quick demo showing the glitch, then slowed it down a bit to show the UI moving up and the page adjusting to compensate.
Is this the glitch you are referring to? If so, I think it’s expected behavior from Chrome on mobile.
Yes it is this laggy feeling. I never experienced that and really think that’s more relied on my website. I also recorded my screen (only on chrome) and look the “text”. It’s like going laggy up and down. I agree, you need to focus on that to see it. But I don’t experience this on any other website :-/…
Thanks for the reply here. I don’t think this is any issue with the text class or styles there.
I took another look and it seems like the glitch is caused when the section height is adjusting on scroll. When looking at your Services Wrapper section, I see you’re using % based heights. Using percentage based values will adjust the size of that section according to the size of the web page without including Chrome’s top and bottom UI. So when the Chrome UI becomes larger on scrolling up, the section adjusts in size accordingly.
I recommend using Viewport Height (VH) here instead of percentage. This is because VW (view width) and VH won’t change when the Chrome UI changes height on scroll (reference):
Lengths defined in viewport units (i.e. vh) will not resize in response to the URL bar being shown or hidden. Instead, vh units will be sized to the viewport height as if the URL bar is always hidden. That is, vh units will be sized to the “largest possible viewport”. This means 100vh will be larger than the visible height when the URL bar is shown.