스타벅스 클론(15) - 페이지 상단으로 이동(ScrollTo)

버튼을 클릭하면 화면 최상단으로 올라가는 기능을 실현할 수 있습니다.

 

html 파일입니다.

버튼이 기타 요소보다 위에 있어야 해서 z-index를 설정했습니다.

 

js파일입니다.

 

지난번 뱃지에서 gsap을 사용했었고, 그 코드를 사용하겠습니다.

배지가 보이면 버튼이 숨겨져야 합니다.

그리고 해당 버튼에다 scrollTo 메소드를 적용하면 됩니다.

 

주의해야할 게 뱃지를 작업했을 때 gsap의 cdn이 scrollTo 기능을 포함하지 않습니다.

scrollTo기능 포함한 cdn을 또 불러 와야 합니다.