원본 이미지의 회전 움직임으로 변환(transition)하여 개체의 내용을 새로이 표현한다.

Script	object.style.filter='progid:DXImageTransform.Microsoft.(propVal)'
HTML	<ELEMENT style="filter:progid:DXImageTransform.Microsoft.(propVal)">

Wheel 필터 예제(클릭)

인수

propVal : (속성 문자열)

필터가 가질 수 있는 한개 이상의 속성들로 속성=값들을 컴마(,)로 연결, 구성된 문자열이다.

애트리뷰트	속성	설명
duration	Duration	변환이 완료될 때까지의 시간을 반환하거나 설정한다.
enabled	Enabled	필터가 작용할 수 있게 할 것인가를 반환하거나 설정한다. true: 사용가능, false:사용 불가능
	Percent	정지된 필터 출력을 캡쳐할 완성도 백분율 포인트를 반환하거나 설정한다.
spokes	spokes	변환에 사용되는 갈라진 조각들의 갯수를 반환하거나 설정한다.
	status	변환의 상태를 반환한다.

메서드	status	설명
apply	1	변환을 위해 원본 개체의 내용을 캡쳐(capture)한다.
play	2	변환하며 디스플레이 한다.
stop	0	변환의 반복을 중지한다.

특기

적용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

참조

Transition

DIV에서 필터 속성 예제

Wheel 필터 예제

필터 효과를 위해 클릭해 보라

필터 표시창

<SCRIPT>
var clickBut=false;
function doPlay(){
  divObj.filters[0].Spokes=8;
  divObj.filters[0].Apply(); // Apply 메서드로 캡쳐된다.
  if (clickBut {
    divObj.style.backgroundColor='pink';
    clickBut=false;
  } else {
    divObj.style.backgroundColor='green';
    clickBut=true;
  }
  divObj.filters[0].Play(); // Play 메서드가 호출되기 전에는 디스플레이 되지 않는다.
  divObj.filters[0].Play();
  str='divObj.style.filter='+divObj.style.filter+'<BR>';
  str+='⇒Enabled=('+divObj.filters[0].Enabled+'), ';
  str+='Duration=('+divObj.filters[0].Duration+'), ';
  str+='Spokes=('+divObj.filters[0].Spokes+')';
  show.innerHTML=str;
}
</SCRIPT>
<DIV id="divObj"
 style="width:500;height:300;background-color:pink;padding=5;font-size:40;line-height:1.2em;color:yellow;font-weight:bold;
  filter:progid:DXImageTransform.Microsoft.Wheel(duration=3);">
<IMG src=../../gif/rfexample.gif width=100><BR>
Wheel 필터 예제
</DIV>
<BUTTON onclick="doPlay()" style="width:500">필터 효과를 위해 클릭해 보라</BUTTON>
<DIV id=show style="width:500;height:50;border:solid 1 blue;padding:3;font-size:80%">필터 표시창</DIV>