Home > Software engineering >  Scroll-behavior: smooth Not Working in Chrome
Scroll-behavior: smooth Not Working in Chrome

Time:10-19

I'm in the process of creating a single page site that relies on the scroll-behavior:smooth CSS property and the method .scrollIntoView({behavior:'smooth'}). I use these mainly to provide a smooth transition between sections, not critical but aesthetically pleasing. Suddenly this feature doesn't seem to be working in Google Chrome. I tested out on Firefox and Chrome mobile and in these works.

I made this pen with the basics of my page: https://codepen.io/gabriel-ar/pen/rEjdYb

Temporarily I've been using https://github.com/iamdustan/smoothscroll , and it solves scrollIntoView, but other plugins like PhotoSwipe are not handling transitions well.

  • Therefore, what is the best fix here? smoothscroll solves part of it, but apparently not everything.
  • Is this a bug in Chrome?
  • scroll-behavior:smooth doesn't seem to be the only property affected, what other thing could have stopped working, if any?

Google Chrome Version 106.0.5249.119

I already uninstalled Chrome and reinstalled it. I Also ran a clean install on a sandbox with the same results.

Thank you!

Update & Solution

It seems this is a local issue, just happening on my computer. Thanks for the replies!

CodePudding user response:

I faced the same issue some time ago, and I came up with this solution:

  1. Open new tab
  2. Go to Chrome's Experimental Flags (chrome://flags)
  3. Search for 'smooth scrolling'
  4. Set the flag to enabled

Let me know if that works for you!

  • Related