Robotics C++ Physics II AP Physics B Electronics Java Astronomy Other Courses Summer Session  

Layers and Behaviors

Layers

Behaviors

Creating Layered Menus Using Layers and Behaviors

Exercises

Layers

A layer is a container in a web page that can hold page elements, such as text and graphics. You can overlap, nest, and show or hide layers on a page. Layers can be used to create web page layouts and, when combined with Behaviors, to create animations and fly-out menus. Layers can be viewed in browsers that support HTML 3.2 and later (for instance, Microsoft Internet Explorer 4.0 or later).

After adding a layer to a web page, you can modify these properties and add new properties to the layer by using the layer and CSS features in Expression Web. You can create layers using the Layers task pane, the Insert menu, or the Toolbox task pane.

  1. In Design view, use the Draw Layer button  to create a new layer by dragging in a web page.

  2. Click the Insert Layer  button to add a new layer where your cursor is located in your web page.

  3. Selected layers appear highlighted in the task pane.

  4. Icons appear in the Layer Visibility column next to layers that contain a visibility property, either visible  or hidden . Layers that don't have an icon are visible by default but don't contain a visibility property. You can click a Layer Visibility icon to change the layer's visibility or remove the property.

  5. The Layer Z-Index column shows the value of a layer's z-index property, which defines the order of the layer along the z-axis. Layers are automatically listed in ascending order.

  6. The Layer ID column display the value of each layer's ID attribute. Each layer must have a unique ID to distinguish it from other layers and other content that is using this attribute.

  7. The ID of a layer that is nested within another layer appears indented under the parent layer.

  8. Click the plus sign  or minus sign  next to the ID of a layer that contains nested layers to expand or collapse the list of nested layers.

Behaviors

The Behaviors task pane enables you to add Behaviors to elements, and manage the Behaviors that have been added to various elements.

 

Insert   

To add a new Behavior, select an element in Design view, and then click Insert. A menu opens with all of the Behaviors appropriate for that element in the schema you have specified in the Authoring tab of the Page Editor Options dialog box. Click the Behavior you want and customize it in the dialog box that opens.

Tag   

See the selected element

Delete   

Delete the selected Behavior

Move Up  and Move Down  buttons   

The Move Up  and Move Down  buttons enable you to change the order of Behaviors in the list. The order in which the code is executed to perform the Behaviors is determined by the order of the Behaviors in the list.

Events column   

See the events that trigger the Behaviors. The dropdown associated with a Behavior allows you to change the event that causes the Behavior to display. For example, you can change onmouseover to onclick to cause the Behavior to occur when the user clicks, rather than hovers the mouse pointer over, the control. The list contains all the Behaviors appropriate for the selected element in the schema you have specified in the Authoring tab of the Page Editor Options dialog box.

Actions column   

See the Behavior that corresponds with the event.