본문 바로가기

카테고리 없음

[자바스크립트] 스르르 Top 스크롤 소스

보통 TOP버튼 링크를 <a href=#top>위로</a> 이런식으로 많이 사용합니다.
위 링크를 클릭하게 되면 바로 맨 위로 올라가게 되지만..
본 소스의 기능은 부드럽게 스크롤 되면서 올라가게 됩니다.


------------------------------------------------


<html>
<head>

<script>
function back_top()
{
        x = document.body.scrollLeft;
        y = document.body.scrollTop;
        step = 2;

        while ((x != 0) || (y != 0)) {
                scroll (x, y);
                step += (step * step / 300);
                x -= step;
                y -= step;
                if (x < 0) x = 0;
                if (y < 0) y = 0;
        }
        scroll (0, 0);
}
</script>
</head>

<body>
페이지를 맨 밑으로 스크롤해보면 TOP버튼이 있습니다.<br>
TOP버튼을 누르면 맨위로 부드럽게 스크롤 되면서 올라갑니다.
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<img src="http://www.blueb.co.kr/SRC/javascript/image/top.gif" onclick="back_top()" style=cursor:hand>

</body>
</html>