보통 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>
* 소피스타일™님에 의해서 게시물 이동되었습니다 (2009-06-03 12:38)
위 링크를 클릭하게 되면 바로 맨 위로 올라가게 되지만..
본 소스의 기능은 부드럽게 스크롤 되면서 올라가게 됩니다.
------------------------------------------------
<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>
* 소피스타일™님에 의해서 게시물 이동되었습니다 (2009-06-03 12:38)