웹마스터 팁

  2. Support
  3. 웹마스터 팁

스크롤되는 레이어 나두 갖구 싶어서 ^^; 맹글어 봤습니다.

2003.05.28 01:25

M@xPond

아직 초보라 잘은 못만들지만..

그렇다고 기분상해들 하지마세요 ^^;;;;(초민망);

만들다 보니까 좀 이상한점이 있는데요 아래로 내려갈때와 위로 올라갈때의

창 맨위 와 여백을 다르게 줘야 비스무레하게 스더라구요..^^;;

글구 좀 알아보기 쉬우라고 지금 아래 쏘스는 pixel값이 input value로 나오게 해놨거든요

사용하실땐 살짝 편집을 하셔야 할듯하네요 ^^

암튼 다른분들보다는 좀 짧아서 그럭저럭 쓸만할까 해서 올려 봅니다.


예제는 몇일만..^^;;;
예) : http://goweb.netcci.org/scroll.html

<body>~</body>사이에 넣으시면 될듯해요~



------------------------------------------------------------
<!-- 이부분이 보여질 부분입니다...-->
<div id="div_id" style="position:absolute;left:300;">
<table border="1" height="300">
<tr>
<td>여기다 내용을 넣으세요</td>
</tr>
<tr>
<td align="center" style="cursor:hand" onclick="moving_control()">메뉴on/off</td>
</tr>
</table>
</div>
<!-- 여기까지-->

<script type="text/javascript" language="javascript">
<!--
var scroll_pixel,div_pixel,gtpos,gbpos,loop,moving_spd;
var top_margin = 50;         /// 창의 맨위와의 여백 내려올때
var top_margin2 = 100;      /// 창의 맨위와의 여백 올라올때
var speed = 20;            /// 점차 줄어드는 속도를 위한 설정          
var speed2 = 15;           /// setTimeout을 위한 속도 설정
var moving_stat = 1;      /// 메뉴의 스크롤을 로딩시 on/off설정 1=움직임 0은 멈춤

function check_scrollmove()
{
  scroll_pixel = document.body.scrollTop;
        gtpos = document.body.scrollTop+top_margin;
        gbpos = document.body.scrollTop+top_margin2;
  if(div_id.style.pixelTop < gtpos)
        {
         moving_spd = (gbpos-div_id.style.pixelTop)/speed;
         div_id.style.pixelTop += moving_spd;    
        }
        if(div_id.style.pixelTop > gtpos)
        {
         moving_spd = (div_id.style.pixelTop-gtpos)/speed;
         div_id.style.pixelTop -= moving_spd;
        }
        loop = setTimeout("check_scrollmove()",speed2);
}
function moving_control()
{
  if(!moving_stat){ check_scrollmove(); moving_stat = 1;}
        else{ clearTimeout(loop); moving_stat = 0; div_id.style.pixelTop = top_margin;}
}
check_scrollmove();
-->
</script>

----------------------------------
궂이 장점을 찾자면.. 소스가 좀 잛다는...-ㅁ-;
그럼 그만 쓸게요 부탁이니 야단은 처두 욕만은..-_-;;
즐암거나 하세요~~
이 게시물을
수정 삭제
좋아요
목록
제목 글쓴이 날짜
상태바에 2개의 메세지가 뜨는 태그 김주형 2003.07.03
마우스 오른쪽 버튼 누르면 원하는 메뉴 뜨게 만들기(다른사이트) [3] 김주형 2003.07.03
아이프레임으로 나타낸 문서를 크기에 맞게 자동으로 사이즈 조절 [3] DODGE 2003.06.28
웹에서그림그리기 [5] 카이저 2003.06.27
손쉬운 롤오버 이미지 자동생성 [15] 행복한고니 2003.06.16
[스크립트] 메뉴에 마우슬 데면 서브 메뉴가 나온다 [2] 처절초보 2003.06.16
[스크립트]오른쪽 버튼 누르면 메뉴나오기^^ [1] 처절초보 2003.06.16
Top, Back 함께사용하기 file sharim 2003.06.11
자바스크립트로 두개 이상의 페이지 동시에 열기. [4] 이성헌 2003.06.08
엔터키 걸러내고 코멘트 무조건 10자이상으로 하게하는 자바스크립트 소스 [9] 교행사랑 2003.06.06
오른쪽마우스 클릭금지,드래그금지,하단주소 숨기기 한꺼번에~ [8] 한길 2003.06.03
크롬리스(Chromless) 웹어플리케이션 -6 (최종) [4] sundew 2003.05.30
메뉴 옆에서 화살표가 스크롤되는.. [2] 힘찬연못 2003.05.29
크롬리스(Chromless) 웹어플리케이션 -5 [3] sundew 2003.05.28
스크롤되는 레이어 나두 갖구 싶어서 ^^; 맹글어 봤습니다. [10] M@xPond 2003.05.28
오른쪽 버튼 클릭시 북마크창 띄우기(1석2조 방식) [4] RedEye(rinja) 2003.05.23
크롬리스(Chromless) 웹어플리케이션 -4 [4] sundew 2003.05.23
손님컴퓨터에 내홈피 즐겨찾기 원클릭으로추가시키기 [5] 호호짱 2003.05.23
크롬리스(Chromless) 웹어플리케이션 -3 [5] sundew 2003.05.21
오늘 날짜와 시간 [3] Brown 2003.05.20
태그 쓰기