메뉴 밑줄 슬라이딩 만들기

프로젝트를 개발 중 메뉴 밑줄 슬라이딩을자연스럽게 구현하고 싶어 정리해 보았습니다. 용어 설명메뉴 밑줄 슬라이딩을 구현하고 싶은데 어떻게 만들어야 할지 막막하다면 여기서 정리한 내용만 차근차근 읽어보시면어떻게 구현하고 어떤 방식으로 만들 수 있는지 이해하실 수 있습니다. 특정 메뉴로 이동하고 싶을 때 애니메이션을 적용하고 싶다면 offset 이라는 기능을 사용하시면 됩니다.그림에서 보시는 바와 같이 검정색 화면이 브라우저 화면이라고 가정해 봅시다.그럴 때 브라우저에서 내가 측정하고 싶은 요소와 브라우저 간의 거리를 확인하고 싶다면 offsetTop 을 이용하시면 됩니다. 이 기능을 이용해서 간편하게 구현하시면 됩니다.아래의 코드는 React 를 이용해서 구현한 코드입니다.아직은 tsx 로 넘어가지 않았으..