t:TRANSITIONFILTER 엘레멘트의 세미콜론(;)으로 분리된 변환의 단계 목록을 반환하거나 설정한다.

인수
: (속성 문자열)

속성값은 t:TRANSITIONFILTER 엘레멘트의 세미콜론(;)으로 분리된 변환의 단계 목록을 나타내는 문자열이다.

값들은 나타난 순서에따라 애니메이션이 일어나는 순서를 결정하고 적용된다.

이 속성의 유효한 값은 0.0과 1.0사이의 실수이다.

이 속성은 읽기/쓰기이며 디폴트값은 없다.

특기

이 애트리뷰트가 지정되면 from, to와 by 애트리뷰트의 조합으로 진행시키는 변환보다 더 정밀한 제어를 제공할 수 있고, 지정되었던 값들을 덮어씌운다.

스크립트를 사용하여 활성 애니메이션을 탄력적으로 변경시킬 때, 작성자는 몇가지 주의하여야 한다. 결과가 의도한 바와 다르거나 이상하게 되지 않게하기 위해서는, 속성들의 값을 변경한 후 beginElement 메서드를 사용하여 다시 시작하는 것이 좋다.

<SCRIPT>
object.endElement();
object.values='.1;.17;.27;.37;.47;.56;.65;.71;.82;.92;1.0';
object.beginElement();
</SCRIPT>

animate, animateMotion과 animateColor 개체들에서는, HTML time2 비헤이버가 사용되어 어느 속성이 애니메이션되는가를 판정하는 모드가 사용된다.

적용
개체scriptHTML규격IE
참조
HTML+time

values 속성값이 calcMode 속성을 반영하여 변환에 진행을 결젱하는데 사용된다.

<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 begin="div1Obj.begin" type="barWipe" dur="5"
  targetElement="div1Obj" values=".1;.17;.27;.37;.47;.56;.65;.71;.82;.92;1.0" calcMode="discrete"/>
<T:TRANSITIONFILTER begin="div1Obj.begin" type="barWipe" dur="5"
  targetElement="div2Obj" values=".1;.17;.27;.37;.47;.56;.65;.71;.82;.92;1.0" calcMode="linear"/>

<INPUT type="button" id="oStartButton" value="transitionFilter 시작">
<DIV class="time" begin="oStartButton.click" id="div1Obj" dur="indefinite"
  style="position:relative;left:0;width:450;height:150;background-image:url(../../gif/flower1.jpg);">
</DIV>
<DIV class="time" begin="oStartButton.click" id="div2Obj" dur="indefinite"
  style="position:relative;left:0;width:450;height:150;background-image:url(../../gif/flower1.jpg);">
</DIV>
</BODY>
</HTML>