목록티스토리 (214)
EverGiver
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/CDWd7/btrLLx0cakl/6fiQVsu1yKoMk4sN1iQMOk/img.png)
아이디 비밀번호 아이디 비밀번호 아이디 비밀번호 글자를 표시하지 않는 방식 1. 시각장애인 X → display:none; 2. 시각장애인 O, 영역 O (배경 이미지를 설정하는 경우) → text-indent:-9999px;overflow:hidden; 3. 시각장애인 X, 영역 X → text-indent:-9999px;overflow:hidden;width:0;height:0;position:absolute; → position:absoulte;left:-9999px; (주로 blind나 screen_out이라는 class를 추가하여 사용한다)
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/YF3u5/btrLOgwtr5n/siRmUtVemYKhn5Ts02LmP1/img.png)
each() 란? jQuery를 사용해 배열을 관리하고자 할 때 each() 메서드를 사용할 수 있다. each() 메서드는 매개 변수로 받은 것을 사용해 for in 반복문과 같이 배열이나 객체의 요소를 검사할 수 있다. // jQuery 유틸리티 메서드 $.each(object, function(index, item){ }); // jQuery 일반 메서드 $(selector).each(function(index, item){ }); each() 예시 사과 딸기 바나나 수박 1 - 오리인테이션 5 - 실습 9 - 쪽지시험 17 - 조별실습 28 - 시험
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/cu5zyA/btrLWmB8iAQ/6Ff1coV510LqH1x9qq2mpk/img.png)
1. 하나씩 열리는 아코디언 형식의 리스트 제목영역1 내용영역1 제목영역2 내용영역2 제목영역3 내용영역3 제목영역4 내용영역4 제목영역5 내용영역5 2. 자유롭게 열고닫는 아코디언 형식의 리스트 제목영역1 내용영역1 제목영역2 내용영역2 제목영역3 내용영역3 제목영역4 내용영역4 제목영역5 내용영역5 stop() : 앞의 동작을 멈추고, 다음 동작을 실행하여라 not(:animated) : 움직이는 것을 제외하고 실행하여라 / 움직이지 않을 때에만 실행하여라 $('dt').click(function(){ $(this) : dt $('dd', this) : dt dd → 클릭한 dt 안에 있는 dd $('+dd', this : dt + dd → 클릭한 dt 뒤에있는 dd })
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/QL8Un/btrLNpf7K5p/5RYmupZPkyZ0OuVnlTS13k/img.png)
클래스 활용 addClass - class를 추가할 때 사용 removeClass - class를 삭제할 때 사용 toggleClass - class를 추가 / 삭제 hasClass - class의 유무를 확인 addClass : class를 추가할 때 사용 addClass removeClass : class를 삭제할 때 사용 removeClass toggleClass : class를 추가/삭제 toggleClass hasClass : class의 유무를 확인 hasClass
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/conwwX/btrLTU6XRoq/86zVfhn5qFw46kbtMUXK4k/img.png)
요소의 위치 및 크기 관련 속성 부모 좌표 노드 구하기 - 부모 좌표 노드란 특정 노드의 기준 좌표가 되는 노드를 의미 $대상.offsetParent() 지역(부모 노드 기준) 좌표 위치 다루기 1. 지역 위치 구하기 $대상.position().left $대상.position().top 2. 지역 위치 설정하기 - 부모 좌표 노드를 기준으로 요소의 위치 설정을 위한 전용 메서드는 없으며 일반 스타일 설정을 위해 사용하는 css() 메서드를 사용한다. $대상.css("left 또는 top", 값) $대상.css({ left:값, top:값 }) 전역 좌표 위치 다루기 - 전역 좌표란 최상위 노드인 문서의 left:0, top:0 위치를 시작점으로 하는 위치 값을 의미한다. 1. 전역 위치 값 구하기 -..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/oBe3U/btrLPnoxm6A/LdIjyHW4SXp0DjyLlIpKgk/img.png)
기본 애니메이션 효과 나타나고 사라지는 효과 - 태그를 숨겼다가 보였다 하는 메소드 - show()는 보이고, hide()는 사라진다. - hide() 메서드는 스타일 속성 중 width와 height 그리고 opactiy 값을 이용해 요소의 크기를 부드럽게, 작게 만듬과 동시에 투명하게 만들어 화면에서 보이지 않게 만드는 기능을 구현하는 메서드이다. (애니메이션이 끝난 후 display 속성 값을 none으로 만들어 주면 화면에서 보이지 않을 뿐 대상 요소가 삭제되거나 하진 않습니다.) - show() 메서드는 hide() 메서드의 반대로 숨겨져 있던 대상 요소의 크기와 투명도 값을 부드럽게 원래대로 만들어 준다. (애니메이션이 끝난 후 display 속성값 역시 원래 값으로 복원시켜 준다.) - to..