show( )
Shows the element and sets its hidden
property
to false
, using an effect if specified.
Description
The show()
function shows the element and returns a Promise that is
resolved when the effect is complete and the element's hidden
property has been set to false
.
You can optionally apply an effect when showing the element by providing
an effectName
value. You can also customize the effect by providing the
optional effectOptions
object.
Effects:
"arc"
"bounce"
"fade"
"flip"
"float"
"fly"
"fold"
"glide"
"puff"
"roll"
"slide"
"spin"
"turn"
"zoom"
Notes:
In Editor X,
show ()
will not make an element visible for a given breakpoint if the element has been set to "Don't Display" for that breakpoint. Callingshow()
will however, change thehidden
property of the element tofalse
.It is recommended not to mix
show
andhide
with "Don't Display" in Editor X.
Syntax
function show([effectName: string], [effectOptions: ArcEffectOptions | BounceEffectOptions | FadeEffectOptions | FlipEffectOptions | FloatEffectOptions | FlyEffectOptions | FoldEffectOptions | GlideEffectOptions | PuffEffectOptions | RollEffectOptions | SlideEffectOptions | SpinEffectOptions | TurnEffectOptions | ZoomEffectOptions]): Promise<void>
show Parameters
NAME
TYPE
DESCRIPTION
string
The name of the effect to play when showing the item.
ArcEffectOptions
|BounceEffectOptions
|FadeEffectOptions
|FlipEffectOptions
|FloatEffectOptions
|FlyEffectOptions
|FoldEffectOptions
|GlideEffectOptions
|PuffEffectOptions
|RollEffectOptions
|SlideEffectOptions
|SpinEffectOptions
|TurnEffectOptions
|ZoomEffectOptions
The effect's options.
Returns
Fulfilled - When the effect is complete and the element's hidden
property has been set to false
.
Return Type:
Was this helpful?
Code Example
1$w("#myElement").show();
Code Example
1$w("#myElement").show("fade");
Code Example
1let fadeOptions = {2 "duration": 2000,3 "delay": 10004};56$w("#myElement").show("fade", fadeOptions);
Code Example
1$w("#myElement").show("fade")2 .then( ( ) => {3 console.log("Done with fade");4 } );
Code Example
1if( $w("#myElement").hidden ) {2 $w("#myElement").show();3}4else {5 $w("#myElement").hide();6}