다연이네

플러그인은 별도의 자바스크립트 파일로 jQuery에 기능을 추가한다. 플러그인은 외우는 것이 아니라, 각각 사용방법이 다르기 때문에 각 플러그인 웹사이트를 참고하여 만들어야 한다. 라이트박스 플러그인 사용해보기 라이트박스 ? 배경은 어둡게 하고 정보가 있는 사각형은 밝게 하는 플러그인 http://avioli.github.io/jquery-lightbox/ avioli/jquery-lightbox @ GitHub A jQuery plugin, inspired and based on Lightbox 2 by Lokesh Dhakar jQuery lightBox plugin is simple, elegant, unobtrusive, no need extra markup and is used to overla..

프레임 애니메이션 setInterval() 함수 포털 사이트 메인 페이지의 실시간 검색어 (일정 시간마다 서버에 데이터를 요청해 사용자에게 보여줌) 이 함수를 이용해 간단한 프레임 애니메이션을 만들어보자 러닝머신 하듯 제자리에서 뛰는 느낌 (여러장의 사진을 이어붙혀 마치 영상처럼 느껴진다.) jQuery로 수정 문서 객체 생성과 추가 A.append(B) == B.appendTo(A) A.before(B) == B.beforeTo(A) A.after(B) == B.afterTo(A) A.prepend(B) == B.prependTo(A)

show(속도) / hide(속도) / toggle(속도) slideDown() / slideUp() / slideToggle() fadeIn() / fadeOut() / fadeToggle() show(속도) / hide(속도) / toggle(속도) Show/Hide/Toggle Lorem ipsum dolor sit amet, consectetur adipisicing elit. Modi optio sint soluta nesciunt laboriosam eaque dicta repellat quis tempore debitis eos explicabo cumque molestiae provident dignissimos suscipit sapiente! Dicta odio? 버튼 누르면 (효과 없..

$(selector).on(이벤트명, 이벤트핸들러); $(선택자).on({이벤트명:이벤트핸들러, 이벤트명:이벤트 핸들러}); => 중괄호 : 이벤트를 여러개 연결 위처럼 하지 않고 on을 1번만 쓴 후 중괄호로 묶어도 된다. 기본 이벤트 제거 event.preventDefault(); //기본 이벤트 제거 event.stopPropagation(); //버블링 제거 (stop 전파) naver 위 코딩은 a태그를 눌러도 링크로 이동하지 않고 alert만 뜬 후 아무 일도 일어나지 않는다. 기본 이벤트를 제거했기 때문이다. 활용 예시2 이름

jQuery 라이브러리를 사용해서 문서 객체 속성을 조작할때는 attr() 메소드를 사용한다. attr()메소드는 매개변수를 넣는 방법에 따라 속성을 지정하거나 추출할 수 있다. - 속성 추출 attr() 메소드에 매개변수를 하나 입력하면 해당 속성을 추출한다. - 속성 지정 1) 속성 값을 입력해 속성 지정 attr() 메소드의 첫번째 매개변수에 속성명을, 두번째 매개변수에 속성값을 입력한다. 2) 객체를 입력해 속성 지정 attr() 메소드의 매개변수에 객체를 넣는다. 3) 함수를 이용해 속성 지정 attr() 메소드의 첫번째 매개변수에는 속성명을, 두번째 매개변수에는 함수를 입력한다.

1. 콜백함수 매개변수로 전달되는 함수 함수 호출 alert가 10번 반복 출력된다. 콜백 함수는 익명 함수로 사용할 때가 많다. 매개변수에 익명함수를 곧바로 입력할 수도 있다는 것을 기억하자. 2. $.each 알아둘 것 jQuery()는 jQuery 라이브러리의 기본 함수라 많이 사용하며, 쉽게 사용할 수 있도록 다음 코드와 같이 변수를 대치한다. window.jQuery == window.$ == jQuery == $ $.add(url, data, callback, type); //jquery가 가진 메소드라는 의미 $.메소드() $.each() == jQuery.each jQuery 객체를 반복하여 일치하는 각 요소에 대해 함수를 실행 Lorem. Aliquam. Quia? Nihil! Non. ..

1. optgroup 옵션 분류하기 김1 김2 김3 이1 이2 이3 2. 미디어 쿼리 설정 미디어쿼리(media query) 기능 ? 미디어 타입에 따라 CSS를 적용할 수 있는 기능 현재나온 브라우저들은 미디어 쿼리 기능을 제공한다. 미디어 타입 ? 장치(프린터, 데스크톱, 스마트폰, 태블릿PC 등) 미디어 쿼리는 2가지 방법으로 사용할 수 있다. ( @media 규칙과 media 속성 ) @-규칙-rule이란 스타일 시트 내부에서 특정한 규칙을 표현하는데 사용 ex) @import 규칙, @font-face 규칙 등 @media(){ } media 속성은 link 태그에 입력해서 해당 미디어 쿼리 조건에 맞는 장치에서만 CSS 파일을 불러올 때 사용 HTML이 지원하는 미디어 타입 all 모든 장치 ..

1. 공간만 확보한 경우 - 의미없는 이미지를 삽입할 때 각 단계는 반드시 작성해야 다음 단계로 넘어갈 수 있다. Register: Name: Contact Info: Birthday: Login Info: Previous Next