AutoHide by PVII
AutoHide by PVII is a behavior that allows you to select any element(s) on your page and set them so that the element will become hidden whenever the user mouses off the element. This is especially useful when creating UL or DIV based navigation systems or other DHTML effects. AutoHide by PVII works by assigning a "special" event that will properly hide the specified element(s) only when the user has actually moved his mouse past the past or outside of the element boundary.
Download the AutoHide by PVII extension
This update to the previous "AutoHide Layers by PVII" expands the auto hide functionality to be available for all id'd elements on the page rather than being restricted only to absolutely positioned divs (Dreamweaver Layers).
Overview
AutoHide by PVII works by creating a list of elements on your page that you wish to have the "auto hide" behavior. You manage the elements that are part of this list by Selecting or De-Selecting them in the autoHide Behavior interface. The behavior is typically applied to the <body> onLoad event so that it is run when the page first loads into the browser, and activating the special "auto hide" events for each of the selected elements. You can use any elements you like, you can even use mixed elements, the only prerequisite is that the element must have an id assigned.
Note: The Auto Hide by PVII behavior will be "grayed" out and un-selectable if there are no elements with an id on the page.
Creating an autoHide behavior
- Select (click) the <body> tag on the lower left border of the Dreamweaver window.
- Click the plus button (+) on the Behaviors Panel.
- Choose Studio VII - autoHide by PVII to open the interface.
- Select a page element that you wish to act on.
- Click the AutoHide button to activate the autoHide feature for this element.
- Repeat Steps 4 and 5 until you have selected all of the elements that you wish to have the autoHide feature.
- Click OK to apply the behavior.
Modifying an existing autoHide behavior
- Select (click) the <body> tag on the lower left border of the DW window, or event that contains an existing autoHide behavior.
- Double-click the autoHide by PVII behavior in the Behavior Panel to open the user interface.
- Set or de-select any of the page elements listed.
- Click OK to apply the revised behavior.
Check the Tutorial Section at the ProjectSeven Web Site for the latest Auto ShowHide/Auto Hide Tutorials.
The Interface:
The autoHide by PVII interface allows you to set the autoHide feature for any element on the page at any time. You can also remove the autoHide feature from any element by clicking the De-Select button.
Auto Hide
This list will display all of the elements on your page that have an "id" attribute assigned. Each element will be displayed with it's element tag name for easier identification and the listing is grouped by tag name. Select the page element that you wish to act on and click the AutoHide Element button. The word "(Selected)" will appear to the right of the element name. This indicates that this layer will have the "autoHide" feature applied to it. You can select and set as many elements as you like.
De-Select Layer
Select any element in the list that is already set as "(Selected)" and click the De-Select Element button. The word "(Selected)" to the right of the element name will disappear, indicating that this element will not have the autoHide feature applied to it.
OK
When you are finished selecting or de-selecting the elements click the OK button to apply the behavior to your page. You can preview the page in your browser to check functionality.
Cancel
Click the Cancel button to completely abort the current AutoHide by PVII operation. This will close the interface and no changes will be made to your page.
Help
Click the Help button to open the associated Help File in your browser. This page can remain open for easy reference while you continue working with the AutoHide by PVII interface.
Auto Hide Layers | back to main listing