KoXo 자바스크립트 - 속성(property) - fill | fill (t:animate, t:animateColor, t:animatemotion, ...) (time)

모체 엘레멘트의 시간이 종료되기 전에 개체의 시간이 종료되면 엘레멘트가 취할 활동을 반환하거나 설정한다.

fill Property

개체의 지속시간 10초, 그러나 시간용기의 지속시간은 15초이다.
이 텍스트는 모체가 종료될 때까지 디스플레이된다.

<HTML xmlns:t="urn:schemas-microsoft-com:time">
<HEAD>
<TITLE>fill Property</TITLE>
<IMPORT namespace="t" implementation="#default#time2">
<STYLE> .time{ behavior: url(#default#time2);}</STYLE>
</HEAD>
<BODY>
<T:EXCL id="exclObj" begin="0" dur="15">
<DIV id="divObj" class="time" begin="0" dur="10" fill="freeze" style="border:solid 1 blue;padding:5">
개체의 지속시간 10초, 그러나 시간용기의 지속시간은 15초이다.<BR>
이 텍스트는 모체가 종료될 때까지 디스플레이된다.</DIV>
</T:excl>
<BUTTON onclick="exclObj.beginElement()">다시 시작</BUTTON><BR>
<SCRIPT>
document.write('exclObj.dur='+exclObj.dur+'<BR>');
document.write('exclObj.fill='+exclObj.fill+'<BR>');
document.write('divObj.dur='+divObj.dur+'<BR>');
</SCRIPT>
</BODY>
</HTML>

m1과 m2의 fill 속성들이 transition이므로 비쳐 보이고, m2 속성은 remove이므로 제거되어 다시시작할 떄 보이지 않는다.

<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:SEQ REPEATCOUNT="indefinite">
<T:MEDIA id="m1" style="position:absolute;left:120;width:300" src = "../../gif/flower1.jpg" dur="3" timeContainer="par" fill="transition" >
<T:TRANSITIONFILTER type="fade" dur="3" onbegin="showA.innerText='m1.fill='+m1.fill"/></T:MEDIA>

<T:MEDIA id="m2" style="position:absolute;left:120;width:350" src = "../../gif/flower1.jpg" dur="3" timeContainer="par" fill="transition"  >
<T:TRANSITIONFILTER type="ClockWipe" dur="3" onbegin="showA.innerText='m2.fill='+m2.fill"/></T:MEDIA>

<T:MEDIA id="m3" style="position:absolute;left:120;width:400" src = "../../gif/flower1.jpg" dur="3" timeContainer="par">
<T:TRANSITIONFILTER type="barnDoorWipe" dur="3" onbegin="showA.innerText='m3.fill='+m3.fill"/></T:MEDIA>
</T:SEQ>
<DIV id=showA style=position:relative;top:300></DIV>
</BODY>
</HTML>

freeze	엘레멘트는 시간이 완료되면 마지막 상태로 유지되어 보인다. 실제적인 엘레멘트의 종료시간은 모체 시간용기 형식에따라 다르다. t:PAR 시간용기에서는, t:PAR 엘레멘트가 종료될 때 종료된다. t:SEQ이나 t:EXCL 시간용기에서는, 다음 엘레멘트가 시작되면 종료된다.
hold	엘레멘트는 시간이 완료되면 모체 시간용기가 완료될 때까지 모체 시간용기의 형식에 관계없이 디스플레이가 마지막 상태로 유지되어 보인다.
remove	엘레멘트는 시간이 완료되면 디스플레이가 제거되어 보이지 않는다.
transition	IE6에서부터 fill에 transition 사용이 가능하다. 엘레멘트는 시간이 완료되면 마지막 상태로 유지되어 보인다. 실제적인 엘레멘트의 종료시간은 다음 순서의 변환의 겹침(overlapping)에따라 다르다. 겹침 엘레멘트의 종료되면 엘레멘트도 종료된다. 유효한 transition을 갖는 엘레멘트에서 다음 조건을 만족시키면 작용한다. t:SEQ나 t:PAR 엘레멘트 속에 있어야 한다. t:TRANSITIONFILTER는 변환되는 엘레멘트의 자식이어야 한다. t:TRANSITIONFILTER의 모체 엘레멘트는 par의 timeContainer 애트리뷰트값을 가져야한다. t:autoReverse는 t:TRANSITIONFILTER 엘레멘트에 사용되지 않아야 한다. 엘레멘트는 배치상 중첩되어야 한다. 현재로서는 엘레멘트가 중첩되지 않아도 transition이 작용하지만, 이후 Explorer에서는 지원되지 않을 것이다.