배경과 개체들의 색상을 점진적으로 적용하여 디스플레이 한다.

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

progid:DXImageTransform.Microsoft. 부분은 생략이 불가능하다.


애트리뷰트 속성 설명
enabled Enabled 필터가 작용할 수 있게 할 것인가를 반환하거나 설정한다. true: 사용가능, false:사용 불가능
  EndColor 변환이 종료되는 위치에서의 색상의 수치값 문자열로 반환하거나 설정한다.
  EndColorStr 변환이 종료되는 위치에서의 색상을 정수로 반환하거나 설정한다.
  GradientType 변환 방향을 지정하는 정수를 반환하거나 설정한다. 1 수평, 0 수직.
  StartColor 변환이 시작되는 위치에서의 색상의 수치값 문자열로 반환하거나 설정한다.
startColorStr StartColorStr 변환이 시작되는 위치에서의 색상을 정수로 반환하거나 설정한다.
특기

변환되는 개체에 텍스트 내용이 있으면 먼저 투명한 것으로 간주하여 변환한 후 적용된 색상으로 업데이트 된다.

적용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, FRAMESET, 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, S, SAMP, SMALL, SPAN, STRIKE, STRONG, SUB, SUP, TABLE, TD, TEXTAREA, TH, TT, U, UL, VAR, XMP

DIV에서 필터 속성 예제


Gradinet 필터 예제
필터 표시창
<SCRIPT>
var clickBut=false;
function doPlay(){
  divObj.filters[0].Apply();
  if (clickBut){
    clickBut=false;
    divObj.style.backgroundColor='pink';
  } else {
    clickBut=true;
    divObj.style.backgroundColor='maroon';
  }
  divObj.filters[0].Play();
  str='divObj.style.filter='+divObj.style.filter;
  show.innerHTML=str;
}
</SCRIPT>
<DIV id="divObj" style="height:200;width:400;background-color:pink;font-size:30;line-height:1.2em;color:blue;
  filter:progid:DXImageTransform.Microsoft.Gradinet(motion=forward,duration=5,gradientsize=.7);">
  <IMG src=../../gif/rfexample.gif width=100><BR>
Gradinet 필터 예제
</DIV>
<BUTTON onclick="doPlay()" style="width:400">필터 효과를 위해 클릭해 보라</BUTTON>
</DIV>
<DIV id=show style="height:20;font-size:14;border:solid 1 blue;padding:3;margin-left:3em;margin-right:3em">필터 표시창</DIV>