[vc_row type=”color” bg_color=”#e8e8e8″ vertical_align=”yes” column_gap=”no” padding_top=”” margin_top=”0″ margin_bottom=”0″ min_height=”220″][vc_column width=”1/2″][vc_empty_space height=”30px”][vc_column_text css=”.vc_custom_1447691971837{margin-bottom: -10px !important;}”]

Actions on scene

[/vc_column_text][vc_column_text css=”.vc_custom_1447693218010{margin-right: 5% !important;}”]

Scroll-to, fullscreen, button for timeline…

With this method, learn how to quickly create anchor points in your projects, play your timeline, create a button for fullscreen.[/vc_column_text][/vc_column][vc_column width=”1/2″][vc_empty_space height=”60px”][vc_column_text css=”.vc_custom_1447693191475{margin-left: 5% !important;}”]

[/vc_column_text][/vc_column][/vc_row][vc_row padding_top=””][vc_column width=”5/6″][vc_single_image image=”123″ img_size=”full” alignment=”center”][vc_empty_space height=”10px”][vc_row_inner][vc_column_inner width=”1/3″][vc_column_text]

[/vc_column_text][vc_separator color=”custom” accent_color=”#009cad”][vc_column_text letter_spacing=””]

1. At first, set the size of your scene. Here we will see a format that pulls vertically, which will be also working with scroll.

Once uploaded my narrative elements in the media library, we import on the scene.

2. Here, the example will be set up with two text block : hotlink, and hotlink2.
3. Add an action “click/tap” on the first anchor (here, hotlink1)

Tips: This method works with all types of content: images, videos, layers action buttons.[/vc_column_text][/vc_column_inner][vc_column_inner width=”2/3″][vc_single_image image=”5601″ img_size=”full” onclick=”link_image” css=”.vc_custom_1463656304110{margin-right: 5% !important;}”][/vc_column_inner][/vc_row_inner][vc_empty_space height=”15px”][vc_row_inner][vc_column_inner width=”1/3″][vc_column_text letter_spacing=””]Now position our text blocks on the scene in the desired report, here hotlink1 will go down in my project to hotlink2.

Add a clic/tap action on hotlink1: the goal is to allow at the click of hotlink1, who is our navigation, to go automatically to the end of his chapter (to hotlink2).

Apply the action on the scene with parameters “scroll vertical”. Choose “hotlink2″as value, validate.

Et voila ! You just created a vertical scroll on the scene on the clic of hotlink1 to hotlink2![/vc_column_text][/vc_column_inner][vc_column_inner width=”2/3″][vc_single_image image=”5604″ img_size=”full” onclick=”link_image” css=”.vc_custom_1463658984932{margin-right: 5% !important;}”][/vc_column_inner][/vc_row_inner][vc_empty_space height=”15px”][vc_row_inner][vc_column_inner width=”1/3″][vc_column_text letter_spacing=””]Parameters and values of the scene in the action tool

• In the parameters tab, by choosing the vertical scroll, the scene will shift from top to bottom or from bottom to top.
• By choosing the horizontal scroll, the scene will shift from left to right or right to left.
• Finally, the dual-axis scroll, you will achieve vertical displacements.

In the “Value” tab, you will find all your layers, allowing to scroll to one selected. You can also choose “min” or “max“, which will cause you to the beginning of the scene, or at the end.[/vc_column_text][/vc_column_inner][vc_column_inner width=”2/3″][vc_column_text letter_spacing=””]

Example of a scroll-to function[/vc_column_text][/vc_column_inner][/vc_row_inner][vc_row_inner][vc_column_inner][vc_empty_space height=”50px”][vc_separator color=”custom” accent_color=”#e8e8e8″][vc_empty_space height=”30px”][/vc_column_inner][/vc_row_inner][vc_row_inner][vc_column_inner width=”1/3″][vc_column_text]

[/vc_column_text][vc_separator color=”custom” accent_color=”#009cad”][vc_column_text]To create a fullscreen button:

1. Add an action “click/tap” on an element
2. Apply on “scene” then choose “fullscreen” in settings.

[/vc_column_text][/vc_column_inner][vc_column_inner width=”2/3″][vc_single_image image=”5607″ img_size=”full” onclick=”link_image” css=”.vc_custom_1463659038004{margin-right: 5% !important;}”][/vc_column_inner][/vc_row_inner][vc_row_inner][vc_column_inner][vc_empty_space height=”50px”][vc_separator color=”custom” accent_color=”#e8e8e8″][vc_empty_space height=”10px”][/vc_column_inner][/vc_row_inner][vc_row_inner][vc_column_inner width=”1/3″][vc_column_text]

[/vc_column_text][vc_separator color=”custom” accent_color=”#009cad”][vc_column_text]To create a button for play with the timeline:

1. Add an action “click/tap” on an element
2. Apply on “scene” then choose a timeline setting: play the timeline, pause the timeline, play/pause, seek-to..

[/vc_column_text][/vc_column_inner][vc_column_inner width=”2/3″][vc_single_image image=”5610″ img_size=”full” css=”.vc_custom_1463659079083{margin-right: 5% !important;}”][/vc_column_inner][/vc_row_inner][/vc_column][vc_column width=”1/6″][vc_empty_space height=”50px”][vc_widget_sidebar sidebar_id=”sidebar-1″][/vc_column][/vc_row][vc_row padding_top=”0″ padding_bottom=”0″][vc_column][vc_empty_space][vc_single_image image=”132″ img_size=”full” alignment=”center”][/vc_column][/vc_row][vc_row type=”color” bg_color=”#e8e8e8″ vertical_align=”yes” column_gap=”no” padding_top=”” margin_top=”0″ margin_bottom=”0″ min_height=”220″][vc_column width=”1/3″][vc_empty_space][vc_column_text]

More
tutorials:

[/vc_column_text][/vc_column][vc_column width=”1/3″][vc_empty_space height=”65px”][vc_column_text]

[/vc_column_text][/vc_column][vc_column width=”1/3″][vc_empty_space height=”65px”][vc_column_text]

[/vc_column_text][/vc_column][/vc_row]