Simple Javascript
You can do many advanced effects and operations using JavaScript and Flux, but in this chapter we are going to focus on attaching a basic Javascript action to an element on the page.
Step 1
First, open or create a simple page for us to work on.
Step 2
Next, create an element to attach an action to, for example a simple div that we can create with 'Quick Div'
Make sure the Div you have just created is selected.
Step 3
Open the 'Actions' palette (⌘-5) by clicking the toolbar button below.
Step 4
As a simple example, we will attach an action to the Div that simply redirects to a new page.
From the Pop Up menu at the top left of the palette, choose 'Simple', which will select a collection of basic JavaScript functions.
From the Pop Up menu in the top right of the palette, choose 'Redirect to page', which is JavaScript function that simply takes the user to a different page (or site).
The target URL can now be typed in to the 'url' field. As you type, Flux will construct the appropriate JavaScript code.
To go to the target page when the user clicks on the Div, make sure the
Event is set to
onClick
Step 5
Once you are happy with your parameters, press the
Attach to Selected Object button, which attaches the JavaScript to the Div we just created.
To indicate the Div has an action attached, a marker will appear on the Div.
Done!
You've now attached a JavaScript action, so you can now try it out in the
Preview mode.
Deleting an action
Deleting the action
You can delete the action you just made using the
Inspector in the
Attributes & Actions section.