accordion, tooltip, autocomplete

위젯에서 위치를 제어하려면 position 매개변수를 활용
position
my(top, bottom, left, right, center) - 자신의 위치
at(top, bottom, left, right, center) - 기점이 되는 요소 상의 위치
of - 기점이 되는 요소(셀럭터식, jquey요소)
collision - 화면에서 넘치는 경우의 처리

daialog : 간단한 대화상자 구현

window.open 메소드 활용법
Url부분이 생략되면 빈화면이 뜨고, 이름 부분이 생략되면 계속 새 창으로 뜨ㅜㄴ다.
속성부분에는 width, height, top, left등의 속성값이 들어간다. 부모창안에서 url로 이동하고 싶다면 _self를 사용한다.
Default값은 _blank이다.
해당 윈도우 창을 닫는 버튼을 구현하고 싶으면 변수에 담은 후 변수명.close()를 사용한다.

_tooltip
정의
툴팁에 표시할 텍스트는 title 속성을 사용한다
이용할 수 있는 요소는 정해진건 없다.

_autocomplete: 자동완성기능
텍스트 상자의 자동완성 기능 구현
source
label:후보 목록에 표시하는 텍스트
value:텍스트 상자에 반영시키는 값
-label, value는 필수이다.
minWidth, maxWidth, minHeight, maxHeight 
-리사이즈했을 대의 모달창의 크기를 잡아준다.
modal : true, false 모달창이 떠있을 때에는 페이즈의 다른 컨텐츠의 비활성화
location.href 
-브라우저의 url 관련 정보를 가지고 있는 location객체의 href속성값을 변경하여 원하는 페이지로 이동


보통 동영상을 유투브에 올리면 압축을해서 화질이 더 떨어진다.
유튜브에 동영상을 업로드하고 나면, 유튜브 자체적으로 자동 인코딩 과정을 거치게 된다. 이 과정에서 동영상의 화질 저하가 발생한다.
랜더링걸때 화질을 최대한 좋게 최고화질로 적용!
1)유튜브 동영상을 자동재생하려면 autoplay=1&mute=1을 같이 준다.
2)무한반복하려면 loop=1&playlist=ID를 준다

accordion
Default functionality
-헤더를 클릭하면 탭과 같이 논리적 섹션으로 나누어진 콘텐츠를 확장/축소할 수 있다.
선택적으로 마우스오버시 섹션 열기/닫기를 전환한다.
Collapse content
-기본적으로 아코디언은 항상 한섹션을 열어둔다.
모든 섹션을 축소할 수 있도록 하려면 collapsible옵션을 true로 설정한다. 
현재 열려 있는 섹션을 클릭하여 콘텐츠 창을 축소한다.
Customize icons
-icons헤더의 기본 및 활성(열림) 상태에 대한 클래스를 허용하는 옵션으로 헤더 아이콘을 사용자 지정한다.
UI CSS 프레임워크의 클래스를 사용하거나 배경 이미지로 사용자 지정 클래스를 만든다.
Fill space
-아코디언은 블록 수준 요소로 구성되기 때문에 기본적으로 너비는 사용 가능한 가로 공간을 채운다.
컨테이너에 의해 할당된 세로 공간을 채우려면 옵션을 heightStyle = "fill"로 설정하면 스크립트가 자동으로 아코디언의 크기를 상위 컨테이너의 높이로 설정한다.
No auto height
-설정 heightStyle = "content" 통해 아코디언 패널이 기본 높이를 유지할 수 있다.
Sortable
-머리글을 드래그하여 패널을 재정렬한다.
 

tooltip
도구 설명은 모든 요소에 첨부할 수 있다.
마우스로 요소를 가리키면 기본 도구 설명처럼 제목 속성이 요소 옆의 작은 상자에 표시된다.
그러나 기본 도구 설명이 아니므로 스타일을 지정할 수 있다.
도구 설명은 각 필드의 컨텍스트에서 몇 가지 추가 정보를 표시하기 위해 양식 요소에도 유용하다.

-위의 링크를 가리키거나 탭 키를 사용하여 각 요소에 대한 포커스를 순환한다.
-이 데모는 공개 이벤트뿐만 아니라 표시 및 숨기기 옵션을 사용하여 애니메이션을 사용자 정의하는 방법을 보여준다.
-항목 및 콘텐츠 옵션을 사용자 지정하여 다양한 이벤트 위임 도구 설명을 단일 인스턴스로 결합하는 방법을 보여준다.
-좋아요/공유/통계 버튼이 있는 가짜 비디오 플레이어, 각각 맞춤형 스타일의 툴팁도 있다.

autocomplete
사용자가 검색 및 필터링을 활용하여 입력할 때 미리 채워진값 목록에서 빠르게 찾고 선택할수 있다.
자동 완성 위젯은 필드에 입력하는 동안 제안을 제공한다. 여기서 제안은 프로그래밍 언어에 대한 태그이다.
자동 완성 필드는 텍스트 필드에 악센트 문자가 포함되지 않은 경우에도 악센트 문자가 있는 결과와 일치하는 사용자 정의 소스 옵션을 사용한다.
그러나 텍스트 필드에 악센트 부호가 있는 문자를 입력하면 악센트 부호가 없는 결과를 표시하지 않을 만큼 똑똑하다.
또한 카데고리 별로 자동완성이 가능한 필드도 있으며,
Autocomplete와 Button을 조합하여 만든 커스텀 위젯도 있다. 
필드에 무언가를 입력하여 입력에 따라 필터링된 제안을 받거나 버튼을 사용하여 전체 선택 목록을 가져올 수 있다.
점진적 향상을 위해 기존 선택 요소에서입력을 읽고 사용자 정의된 소스 옵션과 함께 자동 완성으로 전달한다.
Custom data and display는 기본 포커스를 재정의하고 작업을 선택하여 고유한 사용자 지정 데이터 형식 및 디스플레이를 사용할 수 있다.