Unit 13. Using Behaviors (II)

Show and Hide layer behaviour

One of the most habitual and interesting behaviours is Show and Hide layers. It is obvious that when you want to apply this behaviour there need to be layers present in the file.

In the previous Page you had an example of this type. Lets see which events and actions you need to establish in order to produce the behaviour.

After selecting the image you need to select an action from the list by clicking on the button. In this case the action has to be Show-Hide layers

After selecting the action, you must specify which layers have to be shown and which hidden for the event. For this you need to click twice on the action in Behavior panel.

A new window is then shown, with the list of all the layers in the page, where you can indicate the view variation for each one of the layers.

You can indicate whether they are going to be Shown, Hidden, or if they are going to aquire the initial view (Predetermined).

To determine the speed of each one of the layers it's necessary to select them one by one, indicating the speed through the inferior buttons of the window.

It's not necessary to apply a different view to all the layers of the page, only the ones you want to change at the moment of producing the event. For example, in this case the "catmonth" layer has not been applied a different view, because we don't want it to change when the event plays out.

If you want to clear an established view for any of the layers, you only need to click again on the button of the applied view. For example, to clear the view applied to the "catweek" layer, we would have to click again on the Show button.

You need to be careful about what you want - in this case it is that when you place the mouse on the image the layer is shown, and when the mouse is out of the image the layer is hidden again. For this you need to insert two Show-Hide layers behaviours with the action. One of them will show the layer for the event onMouseOver (when the mouse is over), while the other will hide it for the event onMouseOut (when the mouse is out).

Using JavaScript Code

Another behaviour that can be applied on any object is Call JavaScript. This behavior allows us to insert JavaScript code inside the file code.

For example, it's possible to make the browser window close when you click on an object. To do this you need to insert a "window.close();" JavaScript line.

The same as the layers example, the first thing to do is to select the object on which the behaviour is going to be applied. After this you need to select the Call Javascript action through the button.

Then a new window shows up and you now need to introduce the JavaScript line.

Once the behavior is inserted in the Behavior panel, you need to establish an onclick event to produce the call to JavaScript when clicking on the object.

By clicking twice on the action the previous window is opened again,and it's possible to then modify the line code.

To practice you can perform the Step by step exercise on Inserting Behaviours

  Unit 13 exercises

  Unit 13 evaluation test

Page. 13.2