11-scroll-top.js 634 Bytes
Newer Older
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24
/* eslint-disable no-undef */
;(function () {
  'use strict'

  const scrollToTopButton = document.querySelector('.top-scroll-btn')

  // 스크롤 이벤트 핸들러
  window.addEventListener('scroll', function () {
    // 페이지가 300px 이상 스크롤되었을 때 버튼 표시
    if (window.scrollY > 300) {
      scrollToTopButton.style.display = 'flex'
    } else {
      scrollToTopButton.style.display = 'none'
    }
  })

  // 버튼 클릭 시 페이지 상단으로 스크롤
  scrollToTopButton.addEventListener('click', function () {
    window.scrollTo({
      top: 0,
      behavior: 'smooth',
    })
  })
})()