부드럽게 스크롤되는 Top버튼 스크립트
페이지의 맨 위로 부드럽게 이동시켜 주는 Top버튼 스크립트입니다. 오래전부터 사용해서 원본 소스는 어디에서 구했는지 모르겠구요. 크로스브라우징 때문에 좀 수정했습니다.
파이어폭스, 크롬, 사파리, 오페라, IE6이상 에서 작동합니다.
아래처럼 사용하면 됩니다. ^^
function go_top(orix,oriy,desx,desy) { var Timer; if (document.body.scrollTop == 0) { var winHeight = document.documentElement.scrollTop; } else { var winHeight = document.body.scrollTop; } if(Timer) clearTimeout(Timer); startx = 0; starty = winHeight; if(!orix || orix < 0) orix = 0; if(!oriy || oriy < 0) oriy = 0; var speed = 7; if(!desx) desx = 0 + startx; if(!desy) desy = 0 + starty; desx += (orix - startx) / speed; if (desx < 0) desx = 0; desy += (oriy - starty) / speed; if (desy < 0) desy = 0; var posX = Math.ceil(desx); var posY = Math.ceil(desy); window.scrollTo(posX, posY); if((Math.floor(Math.abs(startx - orix)) < 1) && (Math.floor(Math.abs(starty - oriy)) < 1)){ clearTimeout(Timer); window.scroll(orix,oriy); }else if(posX != orix || posY != oriy){ Timer = setTimeout("go_top("+orix+","+oriy+","+desx+","+desy+")",15); }else{ clearTimeout(Timer); } }
아래처럼 사용하면 됩니다. ^^
<span onclick="go_top();">Top으로</span>
'웹 코딩' 카테고리의 다른 글
crossdomain.xml 문제 해결하기 (0) | 2012.04.04 |
---|---|
jQuery로 만든 롤오버 이미지 소스 (0) | 2012.03.24 |
table td 태그에서 CSS position 크로스브라우징 하기 (0) | 2012.03.13 |
부드럽게 스크롤되는 Top버튼 jQuery (3) | 2012.02.29 |
jQuery가 작동을 하지 않을 땐 (0) | 2012.02.23 |