웹마스터 팁

Top, Back 함께사용하기

2003.06.11 14:22

<script language="Javascript">
document.write('  <div  id=floater style="position: absolute; left: 850px; top: 500px; z-index: 10; width: 15; height: 24;"> ');
document.write('  <a href="javascript:history.go(-1)" onfocus="this.blur()"><img src="/files/attach/images/19360727/783/368/019/btn_back.gif" border="0" style="margin:0 0 3 0"></a><br> ');
document.write('  <a href="#top" onfocus="this.blur()"><img src="/files/attach/images/19360727/783/368/019/btn_top.gif" border="0"></a></div> ');

        self.onError=null;
        currentX = currentY = 0;
        whichIt = null;
        lastScrollX = 0; lastScrollY = 0;
        NS = (document.layers) ? 1 : 0;
        IE = (document.all) ? 1: 0;
        
        function heartBeat() {
                if(IE) {
                          diffY = document.body.scrollTop;
                          diffX = 0;
                       }
            if(NS) { diffY = self.pageYOffset; diffX = self.pageXOffset; }
                if(diffY != lastScrollY) {
                        percent = .1 * (diffY - lastScrollY);
                        if(percent > 0) percent = Math.ceil(percent);
                        else percent = Math.floor(percent);
                        if(IE) document.all.floater.style.pixelTop += percent;
                        if(NS) document.floater.top += percent;
                        lastScrollY = lastScrollY + percent;
            }
                if(diffX != lastScrollX) {
                        percent = .1 * (diffX - lastScrollX);
                        if(percent > 0) percent = Math.ceil(percent);
                        else percent = Math.floor(percent);
                        if(IE) document.all.floater.style.pixelLeft += percent;
                        if(NS) document.floater.top += percent;
                        lastScrollY = lastScrollY + percent;
                }
        }
        if(NS || IE) action = window.setInterval("heartBeat()",1);
</script>

위로가기(top)와 뒤로가기(back)를 스크롤메뉴로 만들어주는 소스입니다.
중복은 아닌지.....검색해 보았는데 없는것 같아서요,,
div에서 이미지 경로와 페이지에서 스크롤되는 위치를 수정하여 주시면 됩니다.
<head></head>에 소스를 넣으시거나 js파일로 만들어 사용하세요
js파일로 저장하여 사용하시면 편리할것 같네요.

이 게시물을

댓글 0

목록

제목	글쓴이	날짜
나만의 미니홈 만들기 ㅡ 메인 기초 설계 .home.php [12]	예뜨락	2004.11.17
나만의 미니홈 만들기 ㅡ 메인 기초 설계2 .레이아웃	예뜨락	2004.11.18
나만의 미니홈 만들기 ㅡ 메인 기초 설계3 .레이아웃 [2]	예뜨락	2004.11.19
나만의 미니홈 만들기 ㅡ 기초적인 관리 페이지 [3]	예뜨락	2004.11.20
나만의 미니홈 만들기 ㅡ 미니홈 생성 페이지 [3]	예뜨락	2004.11.20
나만의 미니홈 만들기 ㅡ 게시판의 디자인	예뜨락	2004.11.22
나만의 미니홈 만들기 ㅡ 게시판 list.php 파일의 모양새 [6]	예뜨락	2004.11.23
나만의 미니홈 만들기 ㅡ list.php , 디비 테이블 생성 [6]	예뜨락	2004.11.26
나만의 미니홈 만들기 ㅡ view.php 파일과 제목링크 [9]	예뜨락	2004.11.27
나만의 미니홈 만들기 ㅡ write.php 파일과 write_ok [5]	예뜨락	2004.11.30
실명 진위여부 확인 [10]	piasol	2004.12.01
개판 오분전 라인 그래프 [4]	미친개	2004.12.01
'참조'에 관한 간단한 예제	플로렐라	2004.12.09
4. 쿼리문 [6]	티다	2004.12.11
나만의 미니홈 만들기 ㅡ메뉴에 게시판 연결 [5]	예뜨락	2004.12.17
IE 에서도 투명 알파값이 적용된 PNG 이미지를 맘껏 활용하자! [8]	THE PAPER™	2004.12.27
"를 그냥 사용하기 [3]	추천대화상대	2005.01.02
나만의 미니홈 만들기 ㅡ delete.php 파일 [2]	예뜨락	2005.01.03
퍼미션을 보기좋게 구하자! [4]	플로렐라	2005.01.03
PHP 왕초보 입문기(총괄) [4]	하나둘	2005.01.15

태그 쓰기