1

I've been trying to use scroll-snap on my website, and it's working wonderfully on firefox, both desktop and mobile.

However, it's not working at all on chrome, either destop or mobile.

The issue is that I have a javascript script constantly changing a text box like this:

while(i<letters.length) {
        await waitForMs(delay);


        splash.innerHTML = splash.innerHTML + letters[i];
        i++;
    }

and whenever the text gets refreshed, the viewport does a little jerk and jumps back up to the text, even if the user is trying to scroll.

You can test the issue at the website at the website here.

There are multiple issues here, but I can see there would be different ways to solve it. The main issue is that the scroll snap is not working on chrome, but another issue is that the javascript is sort of refreshing the viewport? Which means the scroll snap cannot act.

Zac Nolan
  • 34
  • 4
  • Not solved your problem in terms of why Chrome not snapping, but is there a reason for putting snapping on both body and html? It seems to confuse Chrome. – A Haworth Aug 02 '21 at 07:22
  • I've changed that now, although nothing actually changed in the chrome experience. – Zac Nolan Aug 02 '21 at 09:24
  • Interesting, for me (windows 10 Chrome) it stopped the scrolling sort of stuttering and going back to the stop and showing odd snatches of the tex as it scrolledt. Not getting any scrolling stops though. – A Haworth Aug 02 '21 at 10:42
  • Ah, I see the difference. I'd taken the scroll stuff off the html and left it on the body and Chrome at least behaves reasonably (even if not snapping). Your site has it on the html and has taken it off the body. – A Haworth Aug 02 '21 at 10:45
  • ..and someone else has noticed a problem with snapping on html (though there are no full solutions given) [link]https://stackoverflow.com/questions/54903104/is-it-possible-to-apply-css-scroll-snap-to-the-html-tag-rather-than-the-body-tag – A Haworth Aug 02 '21 at 10:47
  • Applying it just to body and not to html stops the jerking, but does not have the scroll snap on any platform, for some reason. – Zac Nolan Aug 03 '21 at 12:17

0 Answers0