Click here for a free WYSIWYG pixel precision HTML editor.
Join the IMS Web Tips weekly newsletter
Email: Name:

Please recommend us to a friend.
================================================

Introduction to Behaviors

We continue to receive a fair number of questions related to Behaviors in IMS Web Engine (see the first User Question). It is not surprising since it is probably the most complex component in the software. I consequently thought that it would be useful to republish a past article on this topic. Even if you don't use Web Engine, you may be interested to see some of the Javascript Events that can be created with it,

-----------------------------------
Both IMS Web Spinner and IMS Web Engine include two simple behaviors that can be assigned to your Objects. These behaviors can set an Object's visibility while the page is first loading, after it has loaded or on a mouse over or mouse leave event. These Behaviors are a useful way to create several special effects that toggle an Object's visibility.

IMS Web Engine includes the ability to create far more complex behaviors based on many different interrelated events. The effective use of these Behaviors is probably the most complex aspect of learning to use IMS Web Engine.

We have tried to simplify several common uses for Behaviors by incorporating them into the IMS Web Engine Wizards. These include the creation of drop menus, strobe effects, and the management of several animation effects. Mastering the use of  the Behavior dialog however, will give you the ability to create complex interactive web pages including DHTML games,
business presentations and educational courseware.

A Behavior works by switching between an 'Active' and a 'Not Active' state. Don't be misled by the terms. There is nothing intrinsically different between the two states other than what you decide to assign to them. In other words, an Object could just as easily be invisible when 'Active' as when 'Not Active'.

The Behavior is composed of two components. The first is an Event that triggers a Behavior 'Active' or 'Not Active'. The second is an Action that will be performed when the Behavior enters either of these two states. The user defines a Behavior by deciding what the trigger mechanisms are and what actions will be performed as the Behavior switch between the two states.

As an example, we can use a simple Mouse Over Behavior to make an Object Visible and Invisible.

is20fig2.htm

The trigger events in this example are the mouse moving over and off the Object. By default, the Object starts in a 'Not Active' state. As the cursor is moved over the Object, it triggers the Object into its 'Active' state. As the cursor moves off the Object it triggers its 'Not Active' state. The Behavior's 'Actions' are to make the Object 'Visible' when it is triggered into its 'Active' state and 'Invisible' when triggered into its 'Not Active' state.

As I mentioned previously, there is no intrinsic difference between an Object's 'Active' and 'Not Active' state. Figure is20fig2 illustrates this with two examples. Example 1 will make an Object Visible as the mouse moves over it. Example 2 does the reverse.

This example is of course very simple and can be more efficiently done by setting an Objects Visibility in the Object Editor. The principle for more advanced Behaviors remains the same. The difference lies in the types of Events that can trigger a Behavior and the Actions that can be performed by the Behavior.

The example at  is20fig3.htm illustrates some of the Behavior dialogs including Triggers and Actions that can be applied to a Behavior. User Triggers include Mouse Over, Mouse Select or a keyboard character. Dynamic triggers include Time, when two Objects intersect or don't intersect, or when an Object's internal value equates to a simple test. An event can also be triggered by another Object when its Events are triggered.

There are many Actions a Behavior can perform when an Event is triggered. These include setting an Object's visibility, starting or stopping its Action or Sound Component if it has one, or triggering the Event of another Object's Behavior. Actions can also include applying a mathematical formula to any Object or performing a Metamorph operation on an Object. Despite the big word, this simply means changing one or more of an Object's Components. An example would be switching an Objects Action component that traces a rectangle to an Action component that traces a polygon.

These operations may seem complicated when taken in their entirety. When looked at individually however, they are far easier to understand.

The Virtual Mechanics Behaviors demo illustrates two simple  Behaviors to make a series of Text Objects visible as the mouse or  the Bird Object moves over them. There are many other examples in  the demo section and at the dhtml magic site including an educational interactive map.. You can also look at the Web Engine tutorials if you have not already done so for more information on creating Behavior.


==============================================
"IMS Web Tips" ISSN 1488-7088
© Copyright 2001 Virtual Mechanics
==============================================

"IMS Web Tips" is a weekly news letter for all web site managers regardless of experience who are looking for detailed information on creating, maintaining and promoting their web sites.

To subscribe send an email to join.imswebtips@list.imswebtips.com or visit www.IMSWebTips.com for subscription information and a list of past articles.

---------------------------------------------------------------------

If you like the contents of this newsletter, please recommend it to a friend. Not only will you help us to continue to provide you with useful and informative articles, you could also win $10,000. Click here for details.

Home Page | Archive by Date | Archive by Topic | Virtual Mechanics | DHTML Magic | SVG Magic