jQuery 화면 효과

(2017-09-04)
1. jQuery에 의해 화면 효과내기 (컨텐츠 표시/숨김 등)

  ㅇ $().hide()        : 요소를 보이지 않게 함
  ㅇ $().show()        : 요소를 보이게 함
  ㅇ $().toggle()      : 요소의 현재 상태를 번갈아 보이게/보이지 않게 함
  ㅇ $().fadeIn()      : 요소를 서서히 보이게 함
  ㅇ $().fadeOut()     : 요소를 서서히 보이지 않게 함
  ㅇ $().fadeToggle()  : 요소의 현재 상태를 번갈아 전환 (fadeIn,fadeOut의 조합)
  ㅇ $().slideUp()     : 요소를 화면 위쪽으로 미끄러지듯(슬라이드) 하면서 보이지 않게 함
  ㅇ $().slideDown()   : 요소를 화면 아래쪽으로 미끄러지듯(슬라이드) 하면서 보이게 함
  ㅇ $().slideToggle() : 요소의 현재 상태를 번갈아 slideUp 또는 slideDown 

  ※ 위 메소드들의 전달 매개변수
     - 첫번째 전달 매개변수시간 단위 임
        . 밀리초 단위 (fast : 200 ms, normal : 400 ms, slow : 600 ms)
     - 두번째 전달 매개변수는 불투명도/이징(Easing) 등 임
        . 불투명도(Opacity) : 0 ~ 1 실수), 0 이면 화면에 보이지 않게 됨
        . 이징(Easing)      : linear, swing
           .. linear : (디폴트) 항상 동일 속도
           .. swing  : 처음에는 느렸다가 점점 빨라지다가 다시 느려짐


2. jQuery에 의해 화면 효과내기 (기타)

  ㅇ $().fadeTo(시간,불투명도,콜백함수) 
     - 주어진 시간에 정해준 불투명도로 서서히 바꾸고 끝나면 콜백함수를 실행

  ㅇ delay(시간) : 요소에 효과를 주어진 시간 만큼 지연시키고 보여줌

  ㅇ $().animate()    : css 속성 값 구문 표현을 거의 그대로 사용 가능
     - 구문 형식 : animate(객체 리터럴, 지정 시간, 이징 설정 옵션, 콜백 함수)
        . 지정 시간 동안 서서히 객체 리터럴에 지정된 css 속성들을 드러나게 한 후,
        . 마지막으로 콜백함수를 수행함
        . 여기서, 이징(Easing) 및 콜백함수는 선택옵션 임

  ㅇ stop() : 기존에 진행하던 에니메이션을 중단시킴

  ㅇ 자바스크립트 함수
     - setTimeout(function, 밀리초) : 정한 시간 후에 함수 실행
     - setInterva(function, 밀리초) : 정한 시간 마다 함수 실행


[jQuery] 1. jQuery 2. jQuery 요소 선택법 3. jQuery 활용 4. jQuery 이벤트 5. jQuery 화면 효과
  1.   기술공통
  2.   기초과학
  3.   파동/광학/음향
  4.   방송/멀티미디어/정보이론
  5.   전자/전기/제어
  6.   통신/네트워킹
  7.   정보기술(IT)
        1. 정보기술
    1.   전산기초
    2.   컴퓨터구조
    3.   프로그래밍
      1.   프로그래밍 언어론
      2.   객체지향
      3.   자료구조
      4.   알고리즘
      5.   자료표현(알파벳/코드)
      6.   시스템 프로그래밍
      7.   프로그래밍언어 종류
            1. 프로그래밍 언어
            2. 기계어,어셈블리언어
        1.   C/C++
        2.   자바(Java)
        3.   자바스크립트
              1. JavaScript
              2. JS 객체
              3. JS 변수,타입
              4. JS 함수
              5. JS 배열
              6. JS 연산자
          1.   JS 이벤트
          2.   JS 활용
          3.   jQuery
            1.   1. jQuery
                2. jQuery 요소 선택법
                3. jQuery 활용
                4. jQuery 이벤트
                5. jQuery 화면 효과
        4.   PHP
        5.   (기타 언어)
      8.   프로그래밍 기타일반
    4.   데이터베이스
    5.   소프트웨어 공학
    6.   운영체제
    7.   정보보호/보안
    8.   IT 기타기술
  8.   기계/재료/공업일반
  9.   표준/계측/품질
  10.   기술경영

 
        최근수정     참고문헌