HTML 1. 시맨틱마크업 html5 테그 머리말 (섹션해더) 본문 (독립섹션) 문서에서 독립적인 하나의 콘텐트를 구분하는데 사용한다. 뉴스 항목, 블로그 본문과 같이 자체적으로 배포될 수있는 독립된 영역을 지정한다. (보조섹션) 문서의 주요 콘텐트와는 별개의 영역을 정의하는데 사용한다. 광고 블럭과 같이 주변의 콘텐트와 별도로 다뤄지는 영역을 지정한다 글 영역 사전적 의미 그대로 웹 문서의 한 부분, 한장을 구분하는데 사용한다 문서 내영역의 범위를 한정하며 문서의 아웃라인을 구성한다. 네비게이션(탬색 링크의 섹션 정의) 메뉴(도구모음 및 목록 양식 컨트롤, 명령) 문서의 제목을 그룹화 하는데 사용한다. 예를 들어 제목과 부제가 동시에 존재하는 문서의 경우 요소와 요소로 제목, 부제목을 정의하며 이들 제..
6.10 instanceof 키워드1) 객체가 어떠한 생성자 함수를 통해 생성됬는지 확인할때 instanceof 키워드 사용. 2) typeof , instanceof typeof => 타입을 알아냄 instanceof => 생성자함수를 알아냄 코드 6-29 instanceof 키워드 DOCTYPE html> // 생성자 함수를 선언합니다. function Student(name) { this.name = name; } // 생성자함수를 사용해 함수를 생성하여 변수에 담음. // 자바스크립트는 대소문자 구분합니다. var student = new Student('윤인성'); // Student 상속받은 student 함수 객체 생성방법 // instanceof는 타입을 비교하여 (true,false)를 ..
17.11 jQuery UIEffect 플러그인 (2) – easing 플러그인1) 기존 jQuery를 사용할 때 교과 관련 메서드의 easing 속성에 문자열 “swing” ,”linear” 만으로 Easing을 줄수있다. 표17-7 다양한 종류의easing 속성linearswing easeInElasticeaseOutElasticeaseInOutElasticeaseInBackeaseOutBackeaseInOutBackeaseInBounceeaseOutBounceeaseInOutBounceeaseInSineeaseOutSineeaseInOutSineeaseInQuadeaseOutQuadeaseInOutQuadeaseInCubiceaseOutCubiceaseInOutCubiceaseInCirceaseOu..
17.9 jQuery UI Effect 플러그인 다운로드 1) jQuery UI플러그인 공식사이트 : http://jqueryui.com/ 2) jQuery UI Effect 기능 ◆ 색상 애니메이션 ◆ addClass() , removeClass(), switchClass() 메서드에 애니메이션 기능추가 ◆ Easing 효과 17.10 jQuery UIEffect 플러그인 (1) – 색상 변환 애니메이션1) addClass(class,speed)메서드와 removeClass(class,speed) 메서드의애니메이션 2) $('div').hover( over ,out ); 코드 17-29DOCTYPE html> .reverse { color:White; background-color:Black; } $(..
17.8 jQuery Approach플러그인 1) jQuery Approach 플러그인은 마우스의 거리를 사용해 애니메이션을 발쌩시키는 플러그인 2) 다운로드 : http://srobbin.com/jquery-plugins/jquery-approach/ 3) approach({ 스타일 } , 효과 적용거리 ) 코드 17-25 approach()DOCTYPE html> * { margin:0px; padding:0px; } body { background:0x555; } #circle_wrapper { padding:10px; background-color:Black; overflow:hidden; } .circle { margin:5px; width:50px; height:50px; border-radi..
17.7 애니메이션 지연1) delay(duration) : 메서드의 매개 변수에 정지하려는 시간을 미리초 단위로 입력 [delay함수의 duration 파라미터 값을 미리 초단위로 입력 (1000 = 1초)] 코드 17-21DOCTYPE html> div { width:100px; height:100px; background-color:Orange; border:solid #ff0000; position:relative; } $(document).ready(function () { /* each 앞에 꺼를 반복 실행합니다. */ $('div').each(function (index ,domElement) { /* Type1 */ // (index * 500)초 후 animate() 메서드를 실행합니다...
17.6 애니메이션 정지1) $(selector).stop(); == $(selector).stop(false,false);◆ 실행 애니메이션을 정지한다.◆ 기본값 (false,false). 2) $(selector).stop(clearQueue , goToEnd); ◆ 애니메이션큐를 삭제 한다 ◆ clearQueue : true => 효과 애니메이션 큐의내용을 제거◆ goToEnd: true => 실행중인 애니메이션 최종위치로바로이동 코드17-20 DOCTYPE html> div { width:100px; height:100px; background-color:Orange; position:relative; } $(document).ready(function () { // 이벤트를 연결합니다. $('b..
T17-4~6 jQuery 메서드 (효과)
- Total
- Today
- Yesterday