개체의 내용 중 지정한 색상을 투명하게 표현한다.

Script object.style.filter='{progid:DXImageTransform.Microsoft.](propVal)'
HTML <ELEMENT style="filter:{progid:DXImageTransform.Microsoft.](propVal)">
Chroma 필터 예제(클릭)
인수
propVal : (속성 문자열)
필터가 가질 수 있는 한개 이상의 속성들로 속성=값들을 컴마(,)로 연결, 구성된 문자열이다.

progid:DXImageTransform.Microsoft. 부분은 생략이 가능하나 속성과 효과가 다소 다를 수 있다.


애트리뷰트 속성 설명
color Color 필터에 적용되는 색상값을 반환하거나 설정한다.
enabled Enabled 필터가 작용할 수 있게 할 것인가를 반환하거나 설정한다. true: 사용가능, false:사용 불가능
특기

색상이 24 bits에서 8 bits로 전환된(dithered) 파일에서는 사용하지 않는 것이 좋다. 특히 JPEG 파일에서는 압축하던가 전환할 때 색상이 제대로 전달되지 한는 경우가 있어 균일한 효과를 얻을 수 없다.

일부의 색상 전환, 압축, 통합, 투명 부분 등에서 제대로 표현되지 않을 수 있다.

적용style
A, ACRONYM, ADDRESS, B, BDO, BIG, BLOCKQUOTE, BODY, BUTTON, CAPTION, CENTER, CITE, CODE, CUSTOM, DD, DEL, DFN, DIR, DIV, DL, DT, EM, FIELDSET, FONT, FORM, FRAME, hn, I, IFRAME, IMG, INPUT type=button, INPUT type=checkbox, INPUT type=file, INPUT type=image, INPUT type=password, INPUT type=radio, INPUT type=reset, INPUT type=submit, INPUT type=text, INS, KBD, LABEL, LEGEND, LI, MARQUEE, MENU, NOBR, OL, OBJECT, P, plainText, PRE, Q, RT, RUBY, runtimeStyle, S, SAMP, SMALL, SPAN, STRIKE, STRONG, STYLE, SUB, SUP, TABLE, TD, TEXTAREA, TH, TT, U, UL, VAR, XMP

DIV에서 필터 속성 예제

청색글자 노랑글자 녹색글자 회색글자
백색글자 검정글자 적색글자 핑크글자
필터 표시창
<STYLE>
.butClass{width:72;}
.strClass{width:100;border:solid 1;background-color:pink;font-size:30;line-height:1.2em;font-weight:bold;padding:4;margin:3;}
</STYLE>
<SCRIPT>
function showit(color){
  divObj.filters.item(0).color=color;
  str='divObj.style.filter='+divObj.style.filter+'<BR>';
  str+='⇒ divObj.filters(0).color=('+divObj.filters(0).color+'), backgroundColor=(pink), ';
  str+='color=('+divObj.filters(0).color+')';
  show.innerHTML=str;
}
</SCRIPT>
<DIV id="divObj"
  style="width:400;height:60;filter:progid:DXImageTransform.Microsoft.Chroma(color=white)">
<SPAN class=strClass style="color:blue;">청색글자</SPAN>
<SPAN class=strClass style="color:yellow;">노랑글자</SPAN>
<SPAN class=strClass style="color:green;">녹색글자</SPAN>
<SPAN class=strClass style="color:gray;">회색글자</SPAN><BR>
<SPAN class=strClass style="color:white;">백색글자</SPAN>
<SPAN class=strClass style="color:black;">검정글자</SPAN>
<SPAN class=strClass style="color:red;">적색글자</SPAN>
<SPAN class=strClass style="color:pink;">핑크글자</SPAN>
</DIV>

<BUTTON onclick="showit('blue')" class="butClass">청색</BUTTON>
<BUTTON onclick="showit('yellow')" class="butClass">노랑</BUTTON>
<BUTTON onclick="showit('green')" class="butClass">녹색</BUTTON>
<BUTTON onclick="showit('gray')" class="butClass">회색</BUTTON>
<BUTTON onclick="showit('white')" class="butClass">백색</BUTTON>
<BUTTON onclick="showit('black')" class="butClass">검정</BUTTON>
<BUTTON onclick="showit('red')" class="butClass">벅색</BUTTON>
<BUTTON onclick="showit('pink')" class="butClass">핑크</BUTTON>
<DIV id=show style="width:576;height:50;border:solid 1 blue;padding:3;font-size:11pt">필터 표시창</DIV>