Проблема с Vue Router

99
13 февраля 2021, 04:40

Ввсем привет, столкнулася с казалось бы триавиальной задачей - подключить smooth mouse wheel scroll. Ранее писал на jquery и это было довольно просто. Но вот с native js\Vue у меня пока что мало опыта. Буду благодарен за любой совет

Вот скрипт который я использовал на своем сайте.

Проблема в том, что для навигации между страницами я использую router-link , и из-за этого скрипт работает неправильно. Мне нужно что бы при переходе на другую страницу scroll position всегда была в самом верху.

Думаю, что его инициализировать какждый разй при переходе на новую страницу. Буду благодарен за дельный совет

вот код:

function SmoothScroll(target, speed, smooth) {
  let targetEl = target;
  if (targetEl === document) {
    targetEl = (document.documentElement || document.body.parentNode || document.body);
  } // cross browser support for document scrolling
  let moving = false;
  let pos = targetEl.scrollTop;
  const requestFrame = (function () { // requestAnimationFrame cross browser
    return (
      window.requestAnimationFrame
      || window.webkitRequestAnimationFrame
      || window.mozRequestAnimationFrame
      || window.oRequestAnimationFrame
      || window.msRequestAnimationFrame
      || function (func) {
        window.setTimeout(func, 1000 / 50);
      }
    );
  }());
  function update() {
    moving = true;
    let delta = (pos - targetEl.scrollTop) / smooth;
    delta -= 1;
    if (pos - targetEl.scrollTop === smooth) delta = 0;
    targetEl.scrollTop += delta;
    if (Math.abs(delta) > 0.5) requestFrame(update);
    else moving = false;
  }

  function scrolled(e) {
    e.preventDefault(); // disable default scrolling
    let delta = e.delta || e.wheelDelta;
    if (delta === undefined) {
      // we are on firefox
      delta = -e.detail;
    }
    delta = Math.max(-1, Math.min(1, delta));
    pos += -delta * speed;
    pos = Math.max(0, Math.min(pos, targetEl.scrollHeight - targetEl.clientHeight)); // limit scrolling
    if (!moving) update();
  }
  target.addEventListener('mousewheel', scrolled, { passive: false });
  target.addEventListener('DOMMouseScroll', scrolled, { passive: false });
}
function init() {
  window.smoothScroll = new SmoothScroll(document, 120, 12);
}
init();
READ ALSO
Не подключается class в img

Не подключается class в img

День добрый! Ребята можете разъяснить почему не подключается класс в данном коде:

115
Почему ввод переменной типа string с помощью getline не работает?

Почему ввод переменной типа string с помощью getline не работает?

Ввод данных о первой коробке срабатывает без ошибокНо начиная со второй не происходит ввод названия (arr[i]

99
Как центрировать все по вертикали CSS

Как центрировать все по вертикали CSS

Нужно отцентровать весь текст с кнопкой по вертикалиПробовал много способов, но так ничего не получилось

122
onMouseDown/Up на мобильных устройствах

onMouseDown/Up на мобильных устройствах

Пишу игру, движение осуществляется с помощью кнопок (стрелок) на которых висит отслеживание onMouseDown (персонаж начинает двигаться) и OnMouseUp (персонаж...

125