stretchStyle Attribute | StretchStyle

HTML (DHTML)

stretchStyle Attribute | StretchStyle Property

Internet Development Index

Sets or retrieves the method used to reveal the new content.

Syntax

HTML
{ filter:progid:DXImageTransform.Microsoft.Stretch(
    stretchStyle = sStyle ... ) ... }
Scripting
object.filters.item(
    "DXImageTransform.Microsoft.Stretch").StretchStyle [ = sStyle ]

Possible Values

sStyleString that specifies or receives one of the following possible values:
HIDEStretches new content over original content from left to right.
PUSHStretches new content in and squeezes original content out, moving from left to right. This motion resembles a cube rotating from one face to another.
SPINDefault. Stretches new content over original content from the center outward.

The property is read/write. The property has a default value of SPIN.

Example

This example uses the backgroundColor property to change the display before the transition is played.

<SCRIPT>
var bToggle = 0;
function fnToggle() {
oDiv.filters[0].Apply();
// After setting Apply, changes to the oDiv object
//  are not displayed until Play is called.
if (bToggle) {
bToggle = 0;
oDiv.style.backgroundColor="gold";
oDiv.innerHTML="TEXT<BR/>TEXT<BR/>TEXT<BR/>TEXT<BR/>"; }
else {
bToggle = 1;
oDiv.style.backgroundColor="green";
oDiv.innerHTML="text<BR/>text<BR/>text<BR/>text<BR/>"; }
oDiv.filters[0].Play();
}
</SCRIPT>
<BUTTON onclick="fnToggle()">Toggle Transition</BUTTON><BR/><BR/>
<FONT SIZE="+4" >
<!-- This DIV is the target of the transition. -->
<DIV ID="oDiv" STYLE="height:250px; width:250px; background-color: gold;
filter:progid:DXImageTransform.Microsoft.Stretch(
duration=2,  stretchStyle='PUSH');">
TEXT<BR/>TEXT<BR/>TEXT<BR/>TEXT<BR/>
</DIV>
<SPAN ID="oSpan"><SPAN>
</FONT>

Applies To

Stretch

See Also

Transitions, Transition Design Considerations