Html & Script

고급스런[top]으로 가기 스크립트

컨텐츠 정보

본문

문서가 길 경우 최상단으로 이동시켜주는 버턴들 많이 다시죠?
이 경우 흔히들 아래 소스를 사용하게 됩니다.
href=#
href=#none
href=#top
href=main.html
onclick=reload()

아래 소개하는 스크립트 소스 한번 적용해보세요.
위의 소스와 같이 문서 최상단으로 이동은 하지만
아주 부드럽고 스무스하게 스크롤되면서 이동하는 고급스런 기능입니다.
--------------------------------------------------------------------------------
<html>
<head>
<!-- TOP 스크롤 -->
<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>
<!-- TOP 스크롤 -->
</head>
<body>
<img src="이미지경로" onclick="back_top()" style=cursor:hand alt="최상단으로 이동">
</body>
</html>

관련자료

댓글 0
등록된 댓글이 없습니다.
Today's proverb
가을에 피는 국화는 첫 봄의 상징으로 사랑받는 개나리를 시샘하지 않는다. 역시 봄에 피는 복숭아꽃이나 벚꽃을 부러워하지 않는다. 한여름 붉은 장미가 필 때, 나는 왜 이렇게 다른 꽃보다 늦게 피나 한탄하지도 않는다. 그저 묵묵히 준비하며 내공을 쌓고 있을 뿐이다. 그러다가 매미소리 그치고 하늘이 높아지는 가을, 드디어 자기 차례가 돌아온 지금, 국화는 오랫동안 준비해온 그 은은한 향기와 자태를 마음껏 뽐내는 것이다. (한비야)