사실간단하다. 웹서핑중 찾은 곳에서 자바스크립트 소스를 다운받아야한다.
다운로드 페이지로가기
다운받은 파일은 smooth_scroll_top.js 으로 소스를 아크로 에디터나 메모장으로 열어보시면
// BackScroll 이벤트 처리
function doBackScroll() {
var pos = getScrollPosition();
window.scrollTo(Math.max(Math.floor(pos.x / 2),0), Math.max(Math.floor(pos.y - (pos.y / 5)),0));
if (pos.x > 0 || pos.y > 0) {
window.setTimeout("doBackScroll()", 35);
return false;
}
}
function doBackScroll() {
var pos = getScrollPosition();
window.scrollTo(Math.max(Math.floor(pos.x / 2),0), Math.max(Math.floor(pos.y - (pos.y / 5)),0));
if (pos.x > 0 || pos.y > 0) {
window.setTimeout("doBackScroll()", 35);
return false;
}
}
부분이 있습니다. 여기서 window.setTimeout("doBackScroll()", 35); 부분에서 35의 숫자를 다른 수로 정해주시면 되는데 많으면 많을수록 스크롤바의 속도가 느려집니다. 즉, 1/100초입니다. 적당히 바꿔주시면 좋을듯 싶네요..
이제 smooth_scroll_top.js를 계정에 등록해주시고 스킨 편집에 오셔서 <head>와 </head>사이에
<script language="JavaScript" src="./smooth_scroll_top.js"></script>
를 넣어주세요 src="~"안에 해당경로는 필수겠죠?
하단부분에 <a href="#" id="Back2Top">TOP</a>를 넣어줍니다.
</a> 이렇게 이미지를 만들어 정해줬습니다만 사이드바나 플로팅 레이어에
넣으셔도 될듯 싶네요. 그리고 소스가 간단해서 TT에서도 될겁니다.
테스트보기
"web_tip" 카테고리의 다른 글
- 활용도 높은 Menu 소스 (투명, 필터, 그림넣기가능) (댓글 0개 / 트랙백 0개) 2006/12/04
- 썸네일 링크 (댓글 6개 / 트랙백 3개) 2006/11/11
- 사이드바,레이어, 테이블등등 - Show/Hide (댓글 0개 / 트랙백 0개) 2006/12/02
- 익스에서 할수있는 재미있는 놀이.. (댓글 0개 / 트랙백 0개) 2007/02/22
- [행복한 고니님의 팁] 제목을 이미지로~ (댓글 0개 / 트랙백 0개) 2007/08/30
Leave your greetings here.