4 ms·

>In 2019, you can do this: html{ scroll-behavior:smooth; } In 2019, caniuse.com says scroll-behavior is not available in Apple Safari or MS IE/Edge: https://

by jasode 8y ago

>In 2019, you can do this: html{ scroll-behavior:smooth; } In 2019, caniuse.com says scroll-behavior is not available in Apple Safari or MS IE/Edge: https://caniuse.com/#search=scroll-behavior https://caniuse.com/#search=scroll-behavior None of my friends with iPhones install Firefox or Chrome on iOS. They all just use the default Safari browser.

jumbopapa 8y ago
I wish I could use Firefox for iOS because of sync, but Safari is the only browser that supports content blockers.
t0astbread 8y ago
Is smooth scrolling really a feature you need in every browser you support?
- jypepin 8y ago
  well, just like any other features, assuming there is a good reason for you to implement that feature, you want most browsers to support it.
gruez 8y ago
Why would you want to force smooth scrolling in the first place? It's a browser setting (at least in Firefox) and it should stay that way.
- ygra 8y ago
  Whoever wants to force it will otherwise do so with JS. With CSS at least you can override it with a client stylesheet.
- jacurtis 8y ago
  I agree, I don't think this is a feature that web designers should worry about. How I scroll is something that should be set on the browser level. This is sort of like a web designer writing CSS to redesign my browser tabs while I visit their site. This isn't their job. Plus, on Mac devices with trackpads, the system OS already adds a smooth scrolling to all actions we do. So when we visit these sites that add smooth scrolling with Javascript it can cause us to go insane. Because scrolling becomes insanely sensitive, with 2-3 inputs trying to control scrolling behavior (the OS, the browser, and now JS). The system is adding its own acceleration and deceleration, and then javascript is sitting on top of that trying to interpret these forces and add their own multiplier on top of those. I have visited sites that have JS implemented smooth scrolling that is so sensitive, that I can't even barely touch the trackpad without scrolling down an entire page length.
giornogiovanna 8y ago
I doubt Firefox or Chrome on iOS support scroll-behavior anyway, since Apple forces them to use WebKit.
est31 8y ago
> None of my friends with iPhones install Firefox or Chrome on iOS. Even if they did, those browsers use the safari rendering engine under the hood, so they'd have the same issue.
jacurtis 8y ago
Does Safari on iOS need to support this feature? Because isn't the entire idea of smooth scrolling to implement the scrolling that was ALREADY natively implemented on iOS? Basically, while Safari might not "support" this feature, they already force their version of smooth scrolling on every site inside their browser. On Safari for iOS or MacOS, you already get smooth scrolling no matter what. So they might not support the spec, but you still get it no matter what. The only explanation I have for IE/Edge is that it is IE/Edge, and no one really expects much from those browsers anymore regardless. If I had a nickle for everytime someone told me "IE doesnt support that", then I wouldn't need a day job. Lastly, this isn't a critical site feature in most cases. If an IE user uses your site without smooth scrolling, will it really impact their experience in any way? Probably not. So this is an example when you can safely use this feature, the browsers that support it will offer nice smooth scrolling, and the ones that don't will offer the same experience that those browser users are already used to.
- oplav 8y ago
  The smooth scrolling set by the "scroll-behavior" is not the same as the user initiated scrolling in iOS. It is scrolling behavior when triggered by a navigation API [0]. If you go to the website in OP and click the table of contents in Chrome and then Safari, you'll see the difference. [0] https://developer.mozilla.org/en-US/docs/Web/CSS/scroll-behavior https://developer.mozilla.org/en-US/docs/Web/CSS/scroll-beha...
  - mikewhy 8y ago
    Yep looks like it affects `scrollTo()` and `scrollIntoView()`, along with in-page navigation. Crazy how they don't let you use a curve to define your own timing.
- andrewingram 8y ago
  It's smooth scrolling when triggered by an action such as a fragment link or a JavaScript API, it's not referring to manual scrolling (eg scroll wheel, touch swipe).

by jasode 8y ago

jumbopapa 8y ago

I wish I could use Firefox for iOS because of sync, but Safari is the only browser that supports content blockers.

t0astbread 8y ago

Is smooth scrolling really a feature you need in every browser you support?

jypepin 8y ago
well, just like any other features, assuming there is a good reason for you to implement that feature, you want most browsers to support it.

gruez 8y ago

Why would you want to force smooth scrolling in the first place? It's a browser setting (at least in Firefox) and it should stay that way.

ygra 8y ago
Whoever wants to force it will otherwise do so with JS. With CSS at least you can override it with a client stylesheet.
jacurtis 8y ago
I agree, I don't think this is a feature that web designers should worry about. How I scroll is something that should be set on the browser level. This is sort of like a web designer writing CSS to redesign my browser tabs while I visit their site. This isn't their job. Plus, on Mac devices with trackpads, the system OS already adds a smooth scrolling to all actions we do. So when we visit these sites that add smooth scrolling with Javascript it can cause us to go insane. Because scrolling becomes insanely sensitive, with 2-3 inputs trying to control scrolling behavior (the OS, the browser, and now JS). The system is adding its own acceleration and deceleration, and then javascript is sitting on top of that trying to interpret these forces and add their own multiplier on top of those. I have visited sites that have JS implemented smooth scrolling that is so sensitive, that I can't even barely touch the trackpad without scrolling down an entire page length.

giornogiovanna 8y ago

I doubt Firefox or Chrome on iOS support scroll-behavior anyway, since Apple forces them to use WebKit.

est31 8y ago

> None of my friends with iPhones install Firefox or Chrome on iOS. Even if they did, those browsers use the safari rendering engine under the hood, so they'd have the same issue.

jacurtis 8y ago

Does Safari on iOS need to support this feature? Because isn't the entire idea of smooth scrolling to implement the scrolling that was ALREADY natively implemented on iOS? Basically, while Safari might not "support" this feature, they already force their version of smooth scrolling on every site inside their browser. On Safari for iOS or MacOS, you already get smooth scrolling no matter what. So they might not support the spec, but you still get it no matter what. The only explanation I have for IE/Edge is that it is IE/Edge, and no one really expects much from those browsers anymore regardless. If I had a nickle for everytime someone told me "IE doesnt support that", then I wouldn't need a day job. Lastly, this isn't a critical site feature in most cases. If an IE user uses your site without smooth scrolling, will it really impact their experience in any way? Probably not. So this is an example when you can safely use this feature, the browsers that support it will offer nice smooth scrolling, and the ones that don't will offer the same experience that those browser users are already used to.

oplav 8y ago
The smooth scrolling set by the "scroll-behavior" is not the same as the user initiated scrolling in iOS. It is scrolling behavior when triggered by a navigation API [0]. If you go to the website in OP and click the table of contents in Chrome and then Safari, you'll see the difference. [0] https://developer.mozilla.org/en-US/docs/Web/CSS/scroll-behavior https://developer.mozilla.org/en-US/docs/Web/CSS/scroll-beha...
- mikewhy 8y ago
  Yep looks like it affects `scrollTo()` and `scrollIntoView()`, along with in-page navigation. Crazy how they don't let you use a curve to define your own timing.
andrewingram 8y ago
It's smooth scrolling when triggered by an action such as a fragment link or a JavaScript API, it's not referring to manual scrolling (eg scroll wheel, touch swipe).