Почему не отрабатывает плавный скролл

Question

Есть простой код. Он должен реализовать плавный скролл на веб-странице.

const btn = document.querySelector('button');
const footer = document.querySelector('footer');

btn.addEventListener('click', () => {
  window.scroll( {
    top: footer.offsetTop,
    behavior: 'smooth',
  });
});

На компьютере в котором я работаю установлены следующие браузеры: chrome, edge, opera, firefox, yandex. Когда я проверяю это в firefox плавный скролл работает как положено. Но в chrome, edge, opera и yandex это происходит резко, то есть функция не отрабатывает. Версии браузеров у меня установлены последние.

Если вы проверите мой код здесь (https://codepen.io/Vagif/pen/BazGXmw?editors=1010) то скорее всего у вас проблем не возникнет. Пробовал взять полифил отсюда (http://iamdustan.com/smoothscroll/) такая же история. Скорее всего проблема не в коде а у меня локально, подскажите куда рыть.

Answer 1

Попробуйте использовать другой метод:

window.scrollTo({
  top: 100,
  behavior: 'smooth'
});

Ваше демо к слову у меня работает, если метод выше не поможет, то делайте чистый браузер, если заработает, то очевидно, что проблема либо в расширениях, либо в кэше.

Answer 2

Дело было в пункте smooth-scrolling в настройках браузера(я сейчас говорю конкретно про хром) Эта функция по умолчанию почему-то выключена(у меня) и более того скрыта. Если у кого-то схожая проблема, включить функцию можно так:

-Запускаем веб-обозреватель, вводим в адресную строку текст chrome://flags/ и жмем на кнопку . -В поле поиска вставляем #smooth-scrolling. -Сменяем значение для данного параметра на Enabled. -Затем перезапускаем браузер. Проще всего это сделать, нажав на кнопку Relaunch.

БЛОГ НА HUSL

Почему не отрабатывает плавный скролл

Ответы (2 шт):