Since Dreamweaver's debut, its easy-to-use and powerful "Behavior" has been one of the hot spots that everyone pays attention to. In Dreamweaver MX (DW MX), this function has been expanded and improved.
In DW MX, behavior refers to an operation (Action) taken in response to an event (Event). Event refers to browser events, such as window refresh, mouse movement, etc. Action refers to the JavaScript code that responds to events in the background and can complete corresponding operations, such as playing sounds, flipping pictures, etc.
Using DW MX to create a navigation drop-down menu is one of the special effects often used in web pages. (Figure 1) Mainly uses the "Show-Hide Layers" behavior in DW MX.
Figure 1
First make the navigation bar (the "Product Center" column in Figure 1), then add a layer as the location where the drop-down menu will be displayed, and fill in the corresponding columns of the drop-down menu.
Next, open the "Behaviors" panel and select the "Product Center" link (note that you cannot select the newly created layer at this time, otherwise the "Show-Hide Layers" behavior cannot be applied), click the "+" sign, and select "Show-Hide Layers", you can see that the layer we just created is in the selection, and can be set to hide or show (Figure 2).
Figure 2
The wonderful use of behavior is mainly reflected in: If we want to implement a drop-down menu, the key is to make the layer display when the mouse moves over the "Product Center" link; and to hide the layer when the mouse leaves the link. Based on this idea, we first set up two Actions for this layer, one chooses Hide and the other chooses Show. Then, adjust the Event and set the Hide Layer's Event to OnMouseOut, which means the mouse leaves the link; and set the Show Layer's Event to OnMouseOver, which means the mouse selects the link. Press "F12" to preview and you can see the effect we expect.
In this way, the navigation drop-down menu that we usually find mysterious can be easily implemented in the behavior. You can also continue to apply the "Swap Image" behavior on navigation links to achieve an image flip effect when the mouse clicks on the link.
Behaviors are not isolated special effects. They can be combined and superimposed by multiple behaviors to achieve complex functions. In addition to the default behaviors set by DW MX, we can also download more cool third-party behaviors from www.mcromedia.com. We only need to copy them directly to the DreamweaverMXConfigurationBehaviorsActions directory to make this shining point of DW MX even more dazzling.