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

Posted by 사용자 낯선.공간
2021. 3. 24. 14:18
반응형

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

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

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

/* 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영역을 스크롤 탑하라는 뜻이겠죠?

이 댓글을 비밀 댓글로