메뉴 건너뛰기

조회 수 7143 추천 수 0 댓글 0
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄

아래 소스는 스크롤 이벤트가 발생할 때, box 레이어를 화면상 최 상단에 1초후에 이동시킨다. 애니메이션 효과 없이 바로 이동 시키기를 원하면 1000 대신 0을 넣는다.


<script>

$(window).scroll(function(){

//스크롤 된 화면의 상단 좌표를 얻는다.

var pos = $(window).scrollTop();

//box 레이어가 1초후에 화면의 꼭대기로 이동한다.

$('#box').stop().animate({top:pos+'px'}, 1000);    

}

</script>


<div id="box">

//내용 표시

</div>



box 레이어의 위치를 화면 상단에서 일정한 위치 아래 두고 싶으면 계산된 pos 값이 원하는 높이값을 더해준다.


  1. hover 메소드를 이용해서 메뉴 on, off를 구현

  2. No Image 21Sep
    by 조쉬
    2016/09/21 Views 7143 

    화면 이동시에 레이어가 따라다니게 하기

  3. No Image 21Sep
    by
    2016/09/21 Views 6471 

    다른 프레임에 있는 객채 참조하는 방법

  4. No Image 21Sep
    by
    2016/09/21 Views 14377 

    동적으로 콤보(select)의 항목(option) 생성하기

  5. No Image 21Sep
    by
    2016/09/21 Views 7346 

    FORM 객체 초기화 하기

  6. No Image 21Sep
    by
    2016/09/21 Views 6679 

    jQuery 예약어 $ 를 사용하지 못하는 경우 해결책 noConflict()

  7. No Image 21Sep
    by
    2016/09/21 Views 9202 

    POST 방식으로 인수를 전달하고 그 결과를 받아오기

  8. No Image 21Sep
    by
    2016/09/21 Views 7530 

    키보드 이벤트가 발생한 객체의 id값 알아내기

  9. No Image 21Sep
    by
    2016/09/21 Views 7125 

    getScript()

  10. No Image 21Sep
    by
    2016/09/21 Views 11552 

    속성선택자를 이용해서 링크에 스타일 입히기

  11. No Image 21Sep
    by
    2016/09/21 Views 8379 

    getJSON() 함수

  12. No Image 21Sep
    by
    2016/09/21 Views 6412 

    load() 메소드

  13. No Image 06Oct
    by
    2016/10/06 Views 7181 

    zeroclipboard - 클립보드 복사하기(자바스크립트 클립보드 복사하기)

  14. jquery 디데이 계산 (D-day,Dday)

  15. No Image 17Nov
    by
    2016/11/17 Views 7149 

    jquery 라디오버튼 선택 확인, 체크박스 선택 확인, 셀렉트박스 선택 확인

  16. No Image 17Nov
    by
    2016/11/17 Views 8836 

    jquery 글자 byte, 문자열 byte(바이트) 길이 체크하기 예제

  17. Html 색상표 모음, 색상코드표 (RGB), 이미지X, 복사 가능

  18. Table을 DIV로 표현하기 (예제)

  19. No Image 17Nov
    by
    2016/11/17 Views 6857 

    jquery enter key event submit (jquery 엔터키 이벤트)

  20. No Image 17Nov
    by
    2016/11/17 Views 6951 

    jQuery, JavaScript 새로고침(reload)

Board Pagination Prev 1 2 3 4 5 6 7 8 9 Next
/ 9

하단 정보를 입력할 수 있습니다

© k2s0o1d4e0s2i1g5n. All Rights Reserved