색상 팔렛트로부터 특정 색상을 선택하는 기능을 제공한다.

script object.style.behavior="url('colorpick.htc')";
object.addBehavior('colorpick.htc');
HTML <INPUT type=text style="behavior:url('colorpick.htc')" id=idVal>
XML 없음
인수 idVal 개체의 유일한 인식자 문자열이다.
특기

window.onload 이벤트가 발생되기 전에는 스크립트로 아래 속성이나 이벤트에 접속할 수 없다. 문서가 완전히 로딩되고, onload 이벤트가 발생되면 해당 페이지의 비헤이버가 적용되고, 모든 속성, 메서드, 이벤트를 스크립트로 사용할 수 있다. 이벤트 발생전에 스트립트로 개체에 접속을 시도하면 스트립트는 그 속성이 개체에서 지원되지 않는다는 오류를 발생시킨다.

이 비헤이버는 IE5(win32,unix)부터 적용된다.


attribute property 설명
cp--cell-height cpCellHeight colorpick 비헤이버에 의하여 디스플레이되는 개별 색상의 높이를 반환하거나 설정
cp--cell-width cpCellWidth colorpick 비헤이버에 의하여 디스플레이되는 개별 색상의 너비를 반환하거나 설정
cp--grid-height cpGridHeight colorpick 비헤이버에 의하여 디스플레이되는 높이를 반환하거나 설정한다.
cp--grid-size cpGridSize colorpick 비헤이버에 의하여 디스플레이되는 색상의 갯수를 반환하거나 설정한다.
cp--grid-style cpGridStyle colorpick 비헤이버의 개별 색상 주위에 그려지는 borderWidth, borderStyleborderColor 속성등 속성들의 값을 반환하거나 설정한다.
cp--grid-width cpGridWidth colorpick 비헤이버에 의하여 디스플레이되는 너비를 반환하거나 설정한다.
cp--hover-style cpHoverStyle 마우스 커서가 올라걌을 때 colorpick 비헤이버의 특정 색상에 그려지는borderWidth, borderStyleborderColor등 속성들의 값을 반환하거나 설정한다.
cp--selected-style cpSelectedStyle colorpick 비헤이버의 특정 색상을 선택했을 때 그려지는 borderWidth, borderStyleborderColor등 속성들의 값을 반환하거나 설정한다.
name name colorpick 비헤이버의 이름을 반환하거나 설정한다.
value value colorpick 비헤이버의 값을 반환하거나 설정한다.

이벤트 설명
onchange colorpick 비헤이버에서 색상이 변경되면 발생된다.
onerror colorpick 비헤이버에서 유효하지 않은 속성값을 할당하거나 읽기전용에 할당을 시도하면 발생한다.

적용
개체 IE
<INPUT type=text style="behavior:url('colorpick.htc')" id=idVal> IE5(win32,unix)

colorpick 비헤이버 예제 현재 선택 색상.
색상값 :


colorpick 비헤이버로 색상을 선택하여 텍스트에 반영시킨다.

<HTML>
<STYLE> .colorpick {behavior: url(exp/ColorPick.htc)}</STYLE>
<SCRIPT>
function doColorChange(){
  theText.style.color = picker.value;
  inColor.value = picker.value.toUpperCase();
}
</SCRIPT>

<BODY>
<DIV id=theText style="border:solid 1 blue;padding:5">colorpick 비헤이버 예제 현재 선택 색상.</DIV>
색상값 : <INPUT id=inColor type="text" size=8><BR><BR>
<INPUT id=picker type="text" class="colorpick" value="#fFFf00" onchange="doColorChange()"><BR>
</BODY>
</HTML>