Dev/script

jquery로 페이지 상단으로 부드럽게 이동하는 탑 스크롤 버튼 만들기

알 수 없는 사용자 2021. 3. 5. 11:13
반응형

보통 탑스크롤이라고 부르는 버튼인데요.

흔한 방식이지만, 가끔 떠 오르지 않아서 검색하시는 분들을 위해 올려둡니다.

뭐~ 저도 가끔은 까먹어서 다시 생각해내는 일 없이 떠다 쓰려공....

/* top 스크롤 */

var speed = 500;
$("a.top").css("cursor", "pointer").click(function(){
$('body, html').animate(, speed);
});

speed 변수는 스크롤이 애니메이트 되어서 이동하는 속도를 지정해줬습니다.

귀찮으면 그냥 변수 쓰지 말고 숫자로 바로 써도 됩니다.

. css("cursor, "pointer")는 생략해도 무방하며, css자체에 a.top { cursor:pointer}로 작성해두어도 무방합니다.

실질적인 핵심은 $('a.top')을 찾아서. click(function(){} 함수를 수행하라는 것이고, 그 수행할 내용은 $('body, html')을 찾아서 .animate(. speed); 0위 치까지 body영역을 스크롤 탑 하라는 뜻이겠죠?

반응형