scrollTo() 안될때

scrollTo은 element에 붙어있는 기본 메소드로 스크롤의 위치를 옮겨줌. 근데 이상하게 이동을 안해서 30분 동안 고생좀 하다가 찾아냄.

 

 

기본 기능

// 1. 좌표형
scrollTo(x좌표, y좌표)

// 2. 옵션형
scrollTo({top: 250}) // y좌표
scrollTo({left: 250}) // x좌표
scrollTo({top: 250, behavior: "smooth"}) // 같이 쓰는 애니메이션(smooth, instant, auto)

이건 그냥 이렇게 쓴다고ㅇㅇ

 

1. 안먹힐때

const html = document.querySelector('html');
const div = document.querySelector('.page');

html.scrollTo({top: div.scrollHeight});

나같은 경우 html에 해당 함수를 실행시키니까 먹혔음. 사실 css로 찍어보면 스크롤이 생기는 위치는 .page라는 영역인데 얘한테 백날 줘도 안됐음. 뭔가 보통 html나 body에 overflow 옵션을 주거나 height를 100vh등으로 줬을때 생기는 문제인거 같은데 아무튼 실제 스크롤이 생긴 위치와 스크롤 함수를 써줘야하는 부분은 다를 수 있으니 이런 경우 html에 메소드를 써보길..