미닫이 문을 닫고 여는 것과 유사한 움직임으로 개체의 내용을 새로이 표시한다.
| Script | object.style.filter='progid:DXImageTransform.Microsoft.(propVal)' |
| HTML | <ELEMENT style="filter:progid:DXImageTransform.Microsoft.(propVal)"> |
| 애트리뷰트 | 속성 | 설명 |
|---|---|---|
| duration | Duration | 변환이 완성되는 시간의 길이를 밀리초 단위로 반환하거나 설정한다. |
| enabled | Enabled | 필터가 작용할 수 있게 할 것인가를 반환하거나 설정한다. true: 사용가능, false:사용 불가능 |
| motion | Motion | 개체의 내용의 변환을 안에서 밖으로하는가, 밖에서 안으로 하는가를 반환하거나 설정한다. |
| orientation | Orientation | 필터 효과를 수평으로 할 것인가 수직으로 할 것인가를 반환하거나 설정한다. |
| Percent | 정지된 필터 출력을 캡쳐할 완성도 백분율 포인트를 반환하거나 설정한다. | |
| status | 변환의 상태를 반환한다. |
| 메서드 | status | 설명 |
|---|---|---|
| apply | 1 | 변환을 위해 원본 개체의 내용을 캡쳐(capture)한다. |
| play | 2 | 변환하며 디스플레이 한다. |
| stop | 0 | 변환의 반복을 중지한다. |
| 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, IFRAME, I, 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 |
<SCRIPT>
var clickBut=false;
function doPlay(){
divObj.filters[0].Apply();
if (clickBut){
divObj.style.backgroundColor='pink';
clickBut=false;
} else {
divObj.style.backgroundColor='blue';
clickBut=true;
}
divObj.filters[0].Play();
str='원래 : '+divObj.style.filter+'<BR>';
str+='divObj.filters[0].orientation='+divObj.filters[0].orientation+'<BR>';
str+='divObj.filters[0].motion='+divObj.filters[0].motion+'<BR>';
str+='divObj.filters[0].duration='+divObj.filters[0].duration+'<BR>';
show.innerHTML=str;
}
</SCRIPT>
<DIV id="divObj"
style="height:200;width:400;background-color:pink;
filter:progid:DXImageTransform.Microsoft.Barn(duration=2,motion='out',orientation='vertical');">
</DIV>
<BUTTON onclick="divObj.filters[0].orientation='vertical';doPlay()" style=width:200>필터 효과(수직)</BUTTON>
<BUTTON onclick="divObj.filters[0].orientation='horizontal';doPlay()" style=width:200>필터 효과(수평)</BUTTON><BR>
<BUTTON onclick="divObj.filters[0].motion='in';doPlay()" style=width:200>필터 효과(안으로)</BUTTON>
<BUTTON onclick="divObj.filters[0].motion='out';doPlay()" style=width:200>필터 효과(밖으로)</BUTTON><BR>
<BUTTON onclick="divObj.filters[0].duration='1';doPlay()" style=width:100>필터 지속(1)</BUTTON>
<BUTTON onclick="divObj.filters[0].duration='2';doPlay()" style=width:100>필터 지속(2)</BUTTON>
<BUTTON onclick="divObj.filters[0].duration='4';doPlay()" style=width:100>필터 지속(4)</BUTTON>
<BUTTON onclick="divObj.filters[0].duration='8';doPlay()" style=width:100>필터 지속(8)</BUTTON>
</DIV>
<DIV id=show style="height:20;border:solid 1 blue;padding:3;margin-left:2em;margin-right:2em">필터 표시창</DIV>