엘레멘트의 변환이 들어오는 것(in)인가 나가는 것인가(out)를 문자열로 반환하거나 설정한다.
속성값은 다음 중 하나의 문자열이다.
| in | 디폴트이며 엘레멘트의 변환(transition)의 들어옴(in: 점차적으로 많이 보이는 방향으로)을 결정한다. |
| out | 엘레멘트의 변환(transition)의 나감(out: 점차적으로 사라지는 방향으로)을 결정한다. |
이 속성은 읽기전용 혹은 읽기/쓰기로 디폴트값은 in이다.
in 속성의 유효한 값은 변환이 진행됨에따라 보이는 지역이 확대되고, out은 변환이 진행됨에따라 보이는 지역이 축소된다. mode 애트리뷰트는 메디어의 시작과 종료에 transitionFilter에 자동적으로 연결되지 않는다. 제작자는 transitionFilter에 transitionFilter 변환의 시작시간을 나타내는 begin 애트리뷰트를 설정할 수 있다.
메디어의 활성시간 중 언제나 변환을 적용할 수 있다. mode가 in으로 되면 메디어 엘레멘트의 활성 시간동안 메디어에 t:TRANSITIONFILTER가 적용된다. 메디어가 점차적으로 많이 나타나는 방향으로 변환이 일어난다. mode가 out로 설정되면, 메디어가 디스플레이되고 점차적으로 감춰지는 방향으로 변환이 일어난다.
애트리뷰트값으로 설정했거나 스크립트로 설정한 후에 다시 스트립트를 통하여 mode 속성의 디폴트값으로 환원할 수는 없다.
| 개체 | script | HTML | 규격 | IE |
|---|
<HTML xmlns:t="urn:schemas-microsoft-com:time">
<HEAD>
<STYLE> .time{behavior: url(#default#time2);} </STYLE>
<IMPORT namespace=t urn="urn:schemas-microsoft-com:time" implementation="#default#time2" />
</HEAD>
<BODY>
<T:TRANSITIONFILTER type="barWipe" dur="3" targetElement="divObj1" mode="in" id="transtObj1"/>
<T:TRANSITIONFILTER type="barWipe" dur="5" targetElement="divObj2" mode="out" id="transtObj2"/>
<DIV class="time" begin="0" id="divObj1" dur="indefinite" style="position:relative; left:20px; width:500px; height:100px;
background-image:url(../../gif/방울.bmp); background-repeat: no-repeat;"></DIV>
<BR>
<DIV class="time" begin="1" id="divObj2" dur="indefinite" style="position:relative; left:20px; width:486px; height:87px;
background-image:url(../../gif/bg01.gif); background-repeat: repeatX;"></DIV>
<P align=center>
<BUTTON onClick="transtObj1.beginElement()">1번(in) 다시 시작 클릭</BUTTON>
<BUTTON onClick="transtObj2.beginElement()">2번(out) 다시 시작 클릭</BUTTON>
</P>
</BODY>
</HTML>