쌍용강북교육센터 국비 학원 Day 56일차 JQuery (선택자 잡는법, animation 메소드)

 

쌍용 강북 교육센터 국비학원 Day 56일차

 

$선택자1.find(선택자2)

- 선택자1 안에 있는 선택자2를 가르키는 것이다.

 

$.prev();

- 선택자의 바로 앞 형제태그 (엘리먼트)를 가르키는 것이다.

 

$.children();

- 선택자의 자식(손자 X) 태그만을 가리키는 것이다.

 

$.parent();

- 선택자의 부모요소 (부모태그)를 가르키는 것이다

 

$.siblings();

- 선택자의 형제요소 (형제태그) 중 선택자 (자기자신)을 제외한 나머지 모든 형제요소를 가르키는 것이다.

 

$.prev();

- 선택자의 바로 앞의 형제요소를 가리키는 것이다.

 

$.next();

- 선택자의 바로 뒤의 형제요소를 가리키는 것이다.

 

$.fadeIn , fadeOut (second);

- 선택자에 해당되는 내용물을 second 값만큼 (밀리초) 천천히 in은 나타내고 out은 사라진다.

 

$.slideDown , slideUp (second);

- 선택자에 해당되는 내용물을 second 값만큼 (밀리초) 위에서 아래로 나타내고, 아래에서 위로 숨긴다.

 

$.animate( {옮겨질 위치 값} , 이동될 시간 );

- 아래의 예제로 선택자인 이미지를 position (relative, absolute) 에 따라 왼쪽에서 부터 600px (left:600), 위에서 부터 500px (top:500) 떨어진 위치로 5000 밀리초(== 5초) 동안 옮겨라는 말이다. 5000 대신에 'slow'(==600), 'normal'(==400), 'fast'(==200)를 사용할 수 있다.

(태그를 이동 시키려면 반드시 position은 relative; 또는 absolute;로 설정되어 있어야 한다)

 

 

 

$.fadeTo(3000, 0.1, 함수이름만)

- 선택자를  3000 밀리초(== 3초) 동안 opacity(투명도)를 0.1로 만든 후 함수이름에 해당 하는 함수를 실행시켜라는 말이다. 함수이름에 해당 하는 함수를 콜백함수 (callback function) 라고 부른다.

 

※ 콜백함수란 - 파라미터로 함수를 전달하는 함수로 현재 실행되고 효과가 완전하게 종료 후에 실행되는 함수를 뜻한다.