Home > Web Front-end > JS Tutorial > Summary of how to use filters.revealTrans.Transition_javascript skills

Summary of how to use filters.revealTrans.Transition_javascript skills

WBOY
Release: 2016-05-16 18:21:11
Original
1623 people have browsed it

Let’s first look at the usage of RevealTrans (it can be opened at the same time when the mouse moves to the link, a prompt will appear similar to the slide effect, and the same will happen if you move it. Let’s consolidate this page).

Syntax:
filter: progid: DXImageTransform.Microsoft.RevealTrans (enabled=bEnabled, duration=fDuration, transition=iTransitionType)
Demonstration: Reference article:
Attributes:
enabled: Optional. Boolean. Sets or retrieves whether the filter is active. true | false true : Default value. Filter activated.
false : Filter is disabled.

duration: optional. Floating point number (Real). Sets or retrieves the time it takes for the conversion to complete. Its value is in seconds.milliseconds (0.0000) format.
You can set the duration of transition playback using the iDuration parameter of the play method. However, once you call the play method, the Duration property becomes read-only while playback continues.
transition: optional. Integer value (Integer). Sets or retrieves the method used by the transformation. 0: Rectangular shrink transformation.
1: Rectangular expansion conversion.
2: Circle shrink conversion.
3: Circular expansion conversion.
4 : Erase upward.
5 : Erase downward.
6: Erase to the right.
7 : Erase to the left.
8: Vertical blind conversion.
9: Horizontal blind conversion.
10: Horizontal conversion of the chess board.
11: Vertical conversion of chess board.
12: Random noise interference conversion.
13: Left and right door closing effect conversion.
14: Left and right door opening effect conversion.
15: Up and down door closing effect conversion.
16: Up and down door opening effect conversion.
17: Jagged edge overlay effect transition from the upper right corner to the lower left corner.
18: Jagged edge overlay effect transition from the lower right corner to the upper left corner.
19: Jagged edge overlay effect transition from upper left corner to lower right corner.
20: Jagged edge overlay effect transition from lower left corner to upper right corner.
21: Random horizontal line conversion.
22: Random vertical line conversion.
23 : Randomly use the possible value conversions above.


Features:
Enabled: Readable and writable. Boolean. See the enabled attribute.
Duration: Readable and writable. Floating point number (Real). See duration property.
Transition: Readable and writable. Integer value (Integer). See transition property.
Percent: Readable and writable. String. Sets or retrieves the point in the conversion process at which the current static filter output is. The value range is 0 - 100. The default value is 0 , conversion has not started yet. 100 for conversion complete.
This feature can be used to create static filter effects using transform filters. Setting its value equal to defines the point at which the conversion process stops. To create a static filter effect using a conversion filter, follow the steps below:
Use the apply method of the conversion filter. This will capture the initial display of the object's contents, setting the Percent property value to 0 .
Change object content. Such as visibility , innerText , background-color , border , or properties of its sub-objects.
Set the Percent property of the conversion filter. That is, determine a certain point in the conversion process that you want. This will capture an image of the content at that point in the conversion process.
Set the Enabled attribute value of the transformation filter to true . The object affected by the filter will update its content based on the acquired image.
Please note: You can only use the visibility property to change an object's children. Otherwise, direct changes to the sub-object will be displayed immediately and will not be captured by the transformation filter.
status: read-only. Integer value (Integer). Retrieves the current status of the transformation. 0 | 1 | 2 0: Conversion stop.
1 : The transformation is applied.
2 : Conversion is in progress (play).


Methods:
apply: Capture the initial display of the object content and make necessary preparations for conversion. No return value.
Once this method is called, any changes to the object properties will not be displayed until you call the play method to start the conversion.
Please note: You can only use the visibility property to change an object's children. Otherwise, direct changes to the sub-object will be displayed immediately and will not be captured by the transformation filter.
When you call the play method, the transformation displays the results of the content changes (changes to the object's properties and the visibility properties of the sub-objects).
play (iDuration): Start conversion. No return value. See the table below for parameters.
iDuration : Optional. Floating point number (Real). Specifies how long the filter lasts. The default unit is seconds.
Use the iDuration parameter of the play method to set the duration of the conversion playback, and its value will replace the setting of the Duration property during the current cycle of the conversion. But the next conversion restores the value set using the Duration property.

stop : Stop conversion playback. And present the conversion result image. Also fires the onfilterchange event. No return value.

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template