TYPE Attribute | type Property (t:TRANSITIONFILTER) (Internet Explorer - HTML+Time 2)

HTML (DHTML)

previous page next page

TYPE Attribute | type Property

Sets or retrieves the type of transition to be applied.

Syntax

HTML <t:TRANSITIONFILTER TYPE = sType... >
Scripting t:TRANSITIONFILTER.type [ = sType ]

HTML	<t:TRANSITIONFILTER TYPE = sType... >
Scripting	t:TRANSITIONFILTER.type [ = sType ]

Possible Values

sType String that specifies or receives the name of the transition type that will be applied to renderable content. See the table below for possible values.
The property is read/write. The property has no default value.

Remarks

This attribute is required and must be one of the transition families listed in the table below, or it must be an extended transition type provided by the user agent.
You can apply more than one transitionFilter to a given object. By doing this, you can apply more than one type of transition. This has the possible effect of multiple types of transitions occurring simultaneously to renderable content. See the example below.
If no subtype is specified, the default subtype associated with the transition type will be used. The type starWipe is an exception. It is required to explicitly include the subtype of "fivePoint" for this transition to work.
Type Associated Subtype(s)
starWipe fivePoint (this must be specified)
barWipe leftToRight, topToBottom
barnDoorWipe vertical, horizontal
irisWipe rectangle, diamond
ellipseWipe circle
clockWipe clockwiseTwelve
fanWipe centerTop
snakeWipe topLeftHorizontal
spiralWipe topLeftClockwise
pushWipe fromLeft
slideWipe fromLeft
fade crossfade
Note You can also use Cascading Style Sheets (CSS) transitions as values for TYPE. See TYPE And SUBTYPE for more information.

Type	Associated Subtype(s)
starWipe	fivePoint (this must be specified)
barWipe	leftToRight, topToBottom
barnDoorWipe	vertical, horizontal
irisWipe	rectangle, diamond
ellipseWipe	circle
clockWipe	clockwiseTwelve
fanWipe	centerTop
snakeWipe	topLeftHorizontal
spiralWipe	topLeftClockwise
pushWipe	fromLeft
slideWipe	fromLeft
fade	crossfade

Examples

This example demonstrates the different transition type values and the possible subtype values that can be used with those type values. In addition, the effects of changing various other attributes of the transitionFilter is also demonstrated.
This feature requires Microsoft?Internet Explorer 6 or later. Click the following icon to install the latest version. Then reload this page to view the sample.
This example shows three DIVs that have two different transitions applied to them simultaneously.
<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" id="tran1" dur="3"
targetElement="firstDiv"/>
<t:transitionfilter type="fade" id="tran1b" dur="3"
targetElement="firstDiv"/>
<t:transitionfilter type="snakeWipe" id="tran2"  dur="3"
targetElement="secondDiv"/>
<t:transitionfilter type="barnDoorWipe" id="tran2b"  dur="3" targetElement="secondDiv"
from="0" to="1"  CalcMode="linear"   mode="in" />
<DIV STYLE="height:170px;">
<DIV CLASS="time"  ID="firstDiv" STYLE="position:absolute; top:150px;
left:20px; background-color:#3366CC; padding:10px; height:80; color:white;">
This div has fade and barwipe types applied.
</DIV>
<DIV CLASS="time" ID="secondDiv" STYLE="position:absolute; top:185px;
left:60px; background-color:#FFCC00; padding:10px; height:80;">
This div has snakeWipe and barnDoorWipe types applied.
</DIV>
</DIV>
</BODY>
</HTML>
This feature requires Microsoft?Internet Explorer 6 or later. Click the following icon to install the latest version. Then reload this page to view the sample.

Applies To

t:TRANSITIONFILTER