앵커 클릭 시 스크롤 바, 스스륵~~ 효과

앵커 클릭 시 애니메이션 효과를 주어 부드럽게 쉬익~ 하면서 이동한다.

팍~!!  1초만에 이동 하는 것도 나쁘지 않지만 애니메이션 효과를 주는 것도

나쁘지 않다.

 

<script>
    // 앵커 클릭 이벤트 등록
    document.querySelectorAll('a[href^="#"]').forEach(anchor => {
      anchor.addEventListener('click', function (e) {
        e.preventDefault();

        const target = document.querySelector(this.getAttribute('href'));
        const targetTop = target.offsetTop;

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

</script>

<a href="#link">링크</a>
<div id="link"></div>