Как сделать плавную прокрутку в vue3?

нужно сделать плавную прокрутку, когда скролишь, при этом чтобы работало на всех браузерах одинаково.
есть такой код
onMounted(() => {
  const banner: Element | null = document.querySelector('#banner')
  const _top: Element | null = document.querySelector('#_top')
  const _bottom: Element | null = document.querySelector('#_bottom')
  const sizeH = (banner as Element).getBoundingClientRect().height
  document.addEventListener(
    'wheel',
    function (e: WheelEvent) {
      positionScroll = e.deltaY
      oY.value = (banner as Element).getBoundingClientRect().top
      if (
        (positionScroll >= 1 && -oY.value <= sizeH) ||
        (positionScroll >= 100 && -oY.value <= sizeH)
      )
        if (!(_bottom as any).click()) (_bottom as any).click()
      if (
        (positionScroll <= -1 && -oY.value <= sizeH) ||
        (positionScroll <= -100 && -oY.value <= sizeH)
      )
        if (!(_top as any).click()) (_top as any).click()
    },
    { passive: false }
  )
  document.addEventListener('click', function (e: any) {
    if (e.target.classList.contains('_bottom') && isScroll.value) {
      scrolling(sizeH)
    }
    if (e.target.classList.contains('_top') && isScroll.value) {
      scrolling(0)
    }
  })
})
function scrolling(size: number = 0) {
  isScroll.value = false
  window.scrollTo({ top: size, left: 0, behavior: 'smooth' })

  setTimeout(() => {
    isScroll.value = true
  }, 500)
}

но суть в том что behavior: "smooth" работает в разных браузерах по разному
  • Вопрос задан
  • 170 просмотров
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
29 мар. 2024, в 17:14
4000 руб./за проект
29 мар. 2024, в 17:04
5000 руб./за проект
29 мар. 2024, в 17:03
3000 руб./за проект