 |
 |
|
 |
| |
Real world scenarios that
fully expose great new functionality in
FrontPage 2003 and Windows SharePoint
Services.
|
|
|
| |
 |
finance |
|
| |
 |
sales & marketing |
|
| |
 |
human resources |
|
|
| |
|
|
 |
 |
| |
FrontPage Developer's Toolkit
> Resources
> Tips and Tricks >
Extending |
 |
 |
| |
How to Create a Fly-out Menu in a FrontPage-based
Web Site
Using Layers and Interactive Buttons in FrontPage 2003,
you can create fly-out menus to enhance your
Web site's navigation. This can all be done without any
direct coding by
using FrontPage.
To create a fly-out menu in your FrontPage-based Web
site, open a Web page in
FrontPage 2003 and do the following:
-
From the Insert menu select Layer and then repeat this step to create 2 Layers.
-
Grab Layer2 and drag it to the
left of Layer1.

-
Select Layer1 and from the Insert menu click
Interactive Button.
-
From the Button tab, choose Border
Bottom 1 under Buttons:,
type FlyOut in the Text: textbox, and select OK.

-
Next, resize Layer1 to be the
same size as the Interactive Button and select Layer2.
-
From the Insert menu, cilck on
Interactive Button, choose Soft Capsule
7, type Support in the Text: textbox and
then type in http://support.microsoft.com in the Link
textbox and select OK.
-
Resize Layer2 to be the same size
as the Interactive Button.
-
To display the Layers task pane,
Right-click on Layer2 and choose Layer
Properties from the fly-out menu.
-
With Layer2 selected in the task
pane, click on the left hand column of Layer2
until you get a closed eye. This will indicate
that the layer’s visibility is set to hidden.

-
Select Layer1 on the page and at
the bottom of the Layers task pane click on Behaviors.
Note: Layer2 is invisible.
-
Click on Insert and choose Change
Property. (The “Scripts On Tag” label should read
<div>).
-
Now click on Select Element
in the Change Property dialog and choose
Layer2 in the Element ID dropdown.
-
Select the Visibility button,
click Visible, and select OK and then OK again.
Note: You have an onclick event now in the
Behaviors task pane.
-
Click on the onclick event,
change it to onmouseover, and Save the
Page. This will also save the images for the
Interactive buttons.
-
To view your fly-out menu, open the page
in your browser and use the mouse to hover over the
visible Interactive button.
More information
For more information about layers, see Microsoft FrontPage 2003 Help.
|
|