Layer Actions

Show/Hide Layers by activating their in and out animations

Contents

Table of Content

Show/Hide Layers

Create rich interactive experiences where content is shown or hidden on-demand

These Actions can be used to show or hide another Layer.  For example, in the following screenshot, a “Go to 1st Frame” Action is applied to the “My-content-layer” Layer.  And the targeted Layer to show is “button-1”.  In this scenario, “button-1” will be hidden by default when the Slide is first shown, and then will animate into view when the “My-content-layer” is clicked. 

Choose “Go to 1st Frame” to “show the Layer“, “Go to Last Frame” to “hide the Layer” and “Toggle 1st / Last Frame” to “show or hide” the Layer based on its visibility state.

  • Go to Frame “N” allows you to trigger “1st / Last Frame” and also “Keyframes” that you’ve configured on a Layer.
  • Next/Previous Frame allows you to trigger the current “Next/Previous” animation state.
  • Toggle “N/M” Frames allows you to toggle any “Keyframes” within a Layer.

1. Interaction
Actions can happen on user-click, mouse-enter or mouse-leave. 

2. Action Type
Selecting this option will allow you to change the current Action to another.

3. Target Layer
Select the other Layer you want to control.

4. Frame wait’s on Action
  • Always wait for Action
    The Layer will only be shown/hidden on user-interaction.
5. After Action
Choose “Reset before each Loop” to reset the Layer’s visibility each time the Slide is shown regardless of the last user-interaction.  Or choose “Keep Last State” to remember the last user-interaction each time the Slide is shown.

6. Action Delay
Add an optional delay that occurs after user-interaction and before the Action is executed.

Simulate Click

Trigger a jQuery click event on another Layer.  Useful if the other Layer has a click Action that you would like to execute.

1. Interaction
Actions can happen on user-click, mouse-enter or mouse-leave. 

2. Action Type
Selecting this option will allow you to change the current Action to another.

3. Target Layer
Select the other Layer you want to simulate the click on.

4. Action Delay
Add an optional delay that occurs after user-interaction and before the Action is executed.

Toggle Layer Class

Add/Remove another Layer’s Class with this Action.  Useful when the other Layer has a custom Class defined.

1. Interaction
Actions can happen on user-click, mouse-enter or mouse-leave. 

2. Action Type
Selecting this option will allow you to change the current Action to another.

3. Target Layer
Select the other Layer you want to toggle the class on.

4. Class to Toggle
The class name to add/remove.

5. Action Delay
Add an optional delay that occurs after user-interaction and before the Action is executed.

Layer Actions

The Author

KC

Strength does not come from winning. Your struggles develop your strengths. When you go through hardships and decide not to surrender, that is strength.

If you need help with anything related to our plugin, please comment on a post or email me at [email protected].

Liked this Post?
Please Share it!