 | JavaScript | |||
|---|---|---|---|---|
| Prev | Home | Up | Next |
| Availability: |
| |||
| Object properties: | Direction, Duration, Enabled, SquaresX, SquaresY | |||
This transition effect supports the following properties:
The Direction property determines which direction the transition should proceed. It accepts the values: left, right, up or down.
The Duration property controls the time it takes to playback the transition effect.
The Enabled property provides a way to activate or inhibit the filter from working by assigning the true or false value to it.
The SquaresX and SquaresY properties describe how many squares the effect should use across the content being transitioned.
The example runs in a continuous loop.
<HTML>
<HEAD>
</HEAD>
<BODY onLoad="switchState()">
<DIV ID="CONTAINER" STYLE="position:absolute; top: 0; left: 0; width: 300; height:300; filter:progid:DXImageTransform.Microsoft.CheckerBoard(direction=left, squaresx=10, squaresy=10) ">
<DIV ID="DIV1" STYLE="position:absolute; top:50; left:10; width:240; height:180;background:ivory">
<BR>
<BR>
<BR>
<HR>
<CENTER>
This is a DIV block containing text.
</CENTER>
<HR>
</DIV>
<DIV ID="DIV2" STYLE="visibility:hidden; position:absolute; top:50; left:10; width:240; height:180; background:antiquewhite; ">
<CENTER>
<BR>
<IMG SRC="./Logo150.gif">
</CENTER>
</DIV>
</DIV>
<SCRIPT>
DIV1.style.visibility="visible";
function switchState()
{
CONTAINER.filters[0].Apply();
if (DIV1.style.visibility == "visible")
{
DIV1.style.visibility="hidden";
DIV2.style.visibility="visible";
}
else
{
DIV1.style.visibility="visible";
DIV2.style.visibility="hidden";
}
CONTAINER.filters[0].Play();
setTimeout("switchState()", 2000);
}
</SCRIPT>
</BODY>
</HTML>| See also: | filter - Blinds(), Filter object, style.filter |
| Property | JavaScript | JScript | N | IE | Opera | NES | ECMA | DOM | CSS | HTML | Notes |
|---|---|---|---|---|---|---|---|---|---|---|---|
| Direction |  | 5.5  | | 5.5 | | | | | | | - |
| Duration | | 5.5 | | 5.5 | | | | | | | - |
| Enabled | | 5.5 | | 5.5 | | | | | | | - |
| SquaresX | | 5.5 | | 5.5 | | | | | | | - |
| SquaresY | | 5.5 | | 5.5 | | | | | | | - |
| Prev | Home | Next |
| filter - Blur() | Up | filter - Chroma() |
JavaScript Programmer's Reference, Cliff Wootton Wrox Press (www.wrox.com) Join the Wrox JavaScript forum at p2p.wrox.com Please report problems to support@wrox.com © 2001 Wrox Press. All Rights Reserved. Terms and conditions. | ||