Percent

HTML (DHTML)

Percent Property

Internet Development Index

Sets or retrieves the point in a transition at which to capture the display for a static filter output.

Syntax

HTML
N/A
Scripting
object.filters.item(
    "DXImageTransform.Microsoft.filter-name").Percent [ = iPercent ]

Possible Values

iPercentString that specifies or receives the progress of the transition, which can range from 0 to 100 percent complete.
0Default. Transition has not started.
100Transition is complete.

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

Remarks

The Percent property uses a transition to create a static filter. The value iPercent defines the point at which to stop the transition. To create the a static filter with a transition, follow these steps:

  1. Use the transition's apply method. This captures the initial content of the object, and sets the Percent property to zero.
  2. Change the object's content. You can change properties of the object: visibility, innerText, backgroundColor, border, or the properties of its child elements.
  3. Set the transition's Percent property. Choose the percent you want the transition to progress and assign that value to iPercent . This captures an image of the content in midtransition.
  4. Set the Enabled property of the transition to true. The content of the object updates to the captured image.

Note  You must use the visibility property to change child elements; otherwise, changes to child element properties are immediate, and not captured by the transition.

Example

This example uses the CheckerBoard transition to create a DIV object with a checkerboard appearance.

<SCRIPT>
function fnSetChecker() {
oDiv.filters[0].Apply();
// After setting Apply, changes to the oDiv object
//  are not displayed until Play is called.
oDiv.style.backgroundColor="blue";
oDiv.filters[0].percent=50;
oDiv.filters[0].enabled=true;
}
</SCRIPT>
<BUTTON onclick="fnSetChecker(); onclick=''">Get Checked Display</BUTTON><BR/><BR/>
<DIV ID="oDiv" STYLE="height:250px; width:250px; background-color: gold;
filter:progid:DXImageTransform.Microsoft.checkerboard(
,duration=5, transition=7);">
</DIV>

Applies To

BlendTrans, RevealTrans, Barn, Blinds, Fade, GradientWipe, Inset, Iris, Pixelate, RadialWipe, RandomBars, RandomDissolve, Slide, Spiral, Stretch, Strips, Wheel, Zigzag

See Also

play, Duration, stop