직접 웹 페이지를 제작해 웹 공간에 띄워 두고 서비스를 경험해 본 분이라면, 한 번쯤 검색해서 활용해 봤을 멋진 이미지 슬라이드나 화려한 UI의 GNB(Global Navigation Bar) 템플릿... 이제 스스로 원리를 알고 제작해 여러분의 홈페이지나 웹앱에 적용할 수 있다. 쓸만한 디자인과 성능을 갖춘 템플릿을 찾아 헤매는 데 지친, 혹은 직접 만들어 보고팠던 모든 분들을 위해 본 도서는 될수록 전 과정을 단계별 예제로 쉽고 친절하게 설명한다.내게 필요한 jQuery 라이브러리를 선택해서 만들고 싶다면, 그럼 꼭 이 책의 예제들을 하나 하나 손수 코딩하며 따라가겠다는 마음만 준비하고 시작하자! Javascript의 기본적인 개념부터 차례대로 따라하는 사이, 여러분도 자신만의 UI를 기획하고 적용할 수 있는 프론트-엔드(Front-End) 개발자로 거듭나고 있을 것이다.
- 머리말- 이 책의 사용법- 부록 다운로드Part 1. Javascript 기본 다지기01 Javascript의 구조 및 적용법01 - 1 Javascript의 기본 구조01 Javascript의 기본 형식 21 02 Javascript의 기본 규칙 22 03 Javascript의 주석 처리 22 01 - 2 Javascript의 적용 방법01 HTML 내부에서 정의하기 24 02 HTML 외부에서 불러오기 24 01 - 3 HTML 문서 내의 Javascript 위치01 Head 요소 안에 정의하는 스크립트 28 02 특정 요소 아래에 정의하는 스크립트 28 03 Body 요소 끝에 정의하는 스크립트 28 01 - 4 기본 입/출력 명령어01 입력 명령어 31 02 출력 명령어 32 02 변수 (Variable) 02 - 1 변수의 정의01 각각 지정하여 만들기 37 02 한 번만 정의하고 쉼표(,)로 구분 37 03 한 번만 정의하고 데이터값 바로 지정 37 02 - 2 변수명 관련 주의사항01 대소문자 구분 37 02 띄어쓰기 37 03 첫 글자 38 04 사용할 수 없는 예약어들 38 05 기타 변수명 관련 규칙 38 02 - 3 변수에 저장 가능한 데이터형01 String(문자) 데이터 39 02 Number(숫자) 데이터 39 03 Boolean(논리) 데이터 39 04 Array(배열) 데이터 40 05 Object(객체) 데이터 40 06 Function(함수) 데이터 40 07 Undefined/Null 데이터 40 03 연산자 (Operator) 03 - 1 산술연산자01 종류 45 02 우선순위 49 03 - 2 대입연산자 50 03 - 3 비교연산자 53 03 - 4 논리연산자 55 03 - 5 비트연산자 56 03 - 6 조건연산자 59 04 제어문 (Control Statement) 04 - 1 iF 문01 if 문 61 02 if ~ else 문 63 03 if ~ else if 문 64 04 if 문 안의 if 문 66 04 - 2 switch 문 70 04 - 3 while 문 72 04 - 4 do ~ while 문 74 04 - 5 for 문01 for 문 75 02 for 문 안의 for 문 77 04 - 6 break 문 79 04 - 7 continue 문 81 05 함수 (Function) 05 - 1 선언적 함수 85 05 - 2 익명 함수01 익명 함수의 형식 및 호출 방법 88 02 람다(Lamda) 함수의 형식 및 호출 방법 89 05 - 3 return 90 05 - 4 매개변수(Parameter) 01 매개변수가 있는 함수의 형식 92 02 매개변수의 개수가 정해지지 않은 함수 95 05 - 5 함수 안에서의 함수 호출01 함수 외부의 함수(전역함수) 호출 97 02 함수 내부의 함수(내부함수) 호출 98 05 - 6 전역(Global)변수와 지역(Local)변수 100 05 - 7 재귀함수 103 05 - 8 내장함수01 인코딩 함수와 디코딩 함수 105 02 숫자, 유/무한값 판별 함수 107 03 숫자 및 문자 변환 함수 109 04 문자를 자바스크립트로 변경하는 함수 111 06 객체 (Object) 06 - 1 객체와 메서드01 new 연산자와 함수를 통한 객체의 정의 115 02 객체 리터럴을 통한 객체의 정의 115 03 객체에 사용되는 for...in 문 119 04 객체의 속성과 메서드 삭제 120 06 - 2 내장 객체01 Number 객체 121 02 String 객체 124 03 Array 객체 127 04 Math 객체 131 05 Date 객체 136 06 정규표현식 객체 141 06 - 3 생성자 함수01 형식과 인스턴스 생성법 147 02 this 키워드 150 03 인스턴스의 속성, 메서드 추가 152 04 객체의 프로토타입 속성 153 05 Object 객체 155 06 클로저(Closure) 157 07 이벤트 (Event) 07 - 1 이벤트의 종류01 마우스 이벤트 161 02 키 이벤트 161 03 폼 이벤트 162 04 로드 및 기타 이벤트 162 07 - 2 이벤트 연결하기01 인라인 방식 162 02 고전 방식 163 03 표준 이벤트 vs IE 이벤트 166 07 - 3 이벤트 객체01 기본 형식 171 02 주요 속성 171 03 주요 메서드 173 04 강제 실행 176 05 this 키워드 사용 180 08 BOM (Browser Object Model) 08 - 1 Window 객체01 open( ), close( ) 메서드 184 02 setInterval( ), clearInterval( ), setTimeout( ), clearTimeout( ) 메서드 186 03 기타 메서드들 192 08 - 2 Document 객체 194 08 - 3 Location 객체01 속성 195 02 메서드 195 08 - 4 Screen 객체 196 08 - 5 History 객체 198 08 - 6 Navigator 객체 199 09 DOM (Document Object Model) 09 - 1 요소의 선택01 요소를 직접 선택하는 방법 204 02 상대 위치로 선택하는 방법 207 09 - 2 요소의 생성 및 삭제01 요소의 생성 214 02 요소의 삭제 219 09 - 3 Javascript의 스타일 적용 221 09 - 4 Form 객체01 form 객체의 선택 223 02 form 객체의 속성 223 03 select 요소와 option 요소 230 04 form 객체에서의 this 사용 232 09 - 5 Cookie 객체01 cookie 생성(setCookie 함수) 235 02 cookie 호출(getCookie 함수) 237 PART II jQuery 기본 다지기01 jQuery 정의 및 사용법01 - 1 jQuery의 정의01 jQuery는 무엇인가? 245 02 왜 jQuery인가? 245 01 - 2 jQuery 사용법01 파일구성 및 작동원리 246 02 라이브러리 다운로드 247 02 실습도구 (jQuery Instrument) 제작02 - 1 결과값 표시( 1 ) Selector 1 단계 253 02 - 2 결과값 표시( 2 ) Selector 2 단계 256 02 - 3 결과값 표시( 3 ) Boolean 258 02 - 4 결과값 표시( 4 ) Text 261 02 - 5 결과값 표시( 5 ) Value 265 02 - 6 결과값 표시( 6 ) HTML 268 02 - 7 결과값 표시( 7 ) Array 272 03 선택자 (Selector) 03 - 1 CSS 기반 셀렉터01 기본(Basic) 셀렉터 277 02 필터(Filter) 셀렉터 285 03 속성(Attribute) 셀렉터 300 03 - 2 jQuery 확장 셀렉터01 속성(Attribute) 셀렉터 310 02 폼(Form) 셀렉터 312 03 필터(Filter) 셀렉터 321 04 메서드 (Method) 04 - 1 DOM 탐색 메서드01 기본(Basic) 탐색 메서드 335 02 그 외(Miscellaneous) 탐색 메서드 347 03 필터(Filter) 메서드 352 04 - 2 DOM 조작 메서드01 값 설정(Setter) 메서드 365 02 값 획득(Getter) 메서드 375 03 값(Value) 변경 메서드 387 04 공간 크기(Dimension) 메서드 392 05 클래스(Class) 메서드 402 06 데이터(Data) 메서드 407 07 교체(Replace) 메서드 414 08 덮개(Wrap) 메서드 417 09 삭제(Remove) 메서드 420 10 이동(Movement) 메서드 432 04 - 3 이벤트 메서드01 바인딩(Binding) 메서드 439 02 문서 준비(Document Ready) 메서드 452 03 마우스 클릭(Click) 메서드 454 04 마우스 동작(Movement) 메서드 459 05 브라우저(Browser) 메서드 472 06 키보드(Keyboard) 메서드 475 07 폼(Form) 메서드 480 04 - 4 이펙트 메서드01 시각적(Visible) 메서드 489 02 페이드(Fade) 메서드 496 03 슬라이드(Slide) 메서드 512 04 애니메이션 조작(Manipulation) 메서드 528 05 애니메이션 기본(Basic) 메서드 538 06 애니메이션 속성(Property) 메서드 546 04 - 5 기타 메서드01 다양한 메서드 552 02 충돌 해결 메서드 562 PART III jQuery 실전 프로젝트01 jQuery D.I.Y. : 기본예제 편01 - 1 전체 메뉴 Show/Hide 01 HTML 마크업 573 02 CSS 스타일링 575 03 jQuery 프로그래밍 575 01 - 2 다양한 2 단형 메뉴01 2단 가로 메뉴 584 02 2단 가로 이미지 메뉴 593 03 풀다운 메뉴 600 04 움직이는 풀다운 메뉴 606 05 현재 위치를 표시하는 메뉴 615 01 - 3 퀵 메뉴01 HTML 마크업 621 02 CSS 스타일링 622 03 jQuery 프로그래밍 623 01 - 4 탭 메뉴01 HTML 마크업 629 02 CSS 스타일링 631 03 jQuery 프로그래밍 631 01 - 5 팝업 배너01 HTML 마크업 633 02 CSS 스타일링 635 03 jQuery 프로그래밍 636 01 - 6 슬라이딩 배너01 HTML 마크업 646 02 CSS 스타일링 647 03 jQuery 프로그래밍 648 01 - 7 폼 유효성 검사01 HTML 마크업 656 02 CSS 스타일링 657 03 jQuery 프로그래밍 658 02 jQuery D.I.Y. : 실무예제 편02 - 1 이미지 체크상자와 라디오버튼01 체크 상태 판별 668 02 부분 함수 구현 669 03 동작 구현 672 04 선택값 확인 674 02 - 2 이미지 선택상자01 기본 팝업 683 02 동작 구현 684 03 선택값 확인 685 PART IV jQuery 플러그인 활용01 모바일 플러그인 적용01 - 1 Swipe : Owlcarousel 01 기본 사용법 696 02 커스텀 이벤트 사용법 700 01 - 2 Scroll : nanoscroll 706 02 jQuery UI : Date Picker 02 - 1 기본 사용법 713 02 - 2 속성 : 최대/최소 715 02 - 3 속성 : 셀렉트 박스 717 02 - 4 속성 : 이미지 아이콘 실행 719 02 - 5 속성 : 날짜 포맷 설정 721 02 - 6 플러그인 : 현지화(i 18 n) 플러그인 설정 723 03 Date JS 03 - 1 기본 사용법 : 현재 날짜 확인, now() 728 03 - 2 기본 사용법 : 일수 계산, addDays() 730 03 - 3 기본 사용법 : 월수 계산, addMonths() 732 03 - 4 기본 사용법 : 날짜 포맷 변환 734 03 - 5 기본 사용법 : 두 날짜 비교 736 03 - 6 마무리하기 : jQuery UI, Date Picker와 연동하기 738 04 jstree 04 - 1 기본 사용법 744 04 - 2 이벤트 적용하는 방법 745 04 - 3 플러그인 적용법 : checkbox 748 04 - 4 플러그인 적용법 : sort 749 04 - 5 플러그인 적용법 : context menu 751 04 - 6 플러그인 적용법 : drag and drop 753 04 - 7 플러그인 적용법 : unique 754 04 - 8 플러그인 적용법 : search 756 04 - 9 마무리하기 : 실무에서 사용하는 방법 759 05 jquery.cookie.js 05 - 1 기본 사용법01 cookie 메서드 : 쿠키 저장하기 766 02 cookie 메서드 : 쿠키 가져오기 766 03 removeCookie 메서드 : 쿠키 삭제하기 767 05 - 2 마무리하기 : 실무에서 사용하는 방법 769부록# JavaScript 객체표 773
