1

Table of ContentsWelcome to Menu.Applet ................................................................................ 2Why Java™-based menus? .............................................................................. 2Basic terminology ........................................................................................... 2Getting to know Menu.Applet .......................................................................... 4Creating a new menu applet ............................................................................ 5

Applet Properties Panel: General Tab .................................................................................................... 5Background Tab ................................................................................................................................... 6Options Tab (Slider menu only) ........................................................................................................... 7

Creating a new Slider menu ............................................................................ 8Item Tab ............................................................................................................................................... 9Level - General Tab ............................................................................................................................... 9Level – Icon Tab ................................................................................................................................. 10Level – Event Tab ................................................................................................................................ 10

Creating a Pop-up menu ............................................................................... 11Item Tab ............................................................................................................................................. 12Main Menu Tab (First level menu only) .............................................................................................. 12Level - General Tab ............................................................................................................................. 13Level – Color Tab ................................................................................................................................ 13

Using HTML frames ....................................................................................... 14Saving your work .......................................................................................... 15

2

Menu Interactive lists that display anumber of choices for users (in this case,Internet Web surfers) to choose from.When selected, each choice then displays agraphic image, a media clip, a downloadaction, or another Web page.

Menu Items Options listed in a menu. Inmost cases, further options (submenus) arefound within these choices, bringing abouta multi-level menu.

Pop-upMenuAmenu that displays itssubmenus only onmouseover.

Welcome to Menu.AppletWelcome to Ulead�s Menu.Applet, a powerful Java�-based application programthat lets you create active slider and pop-up menus for your Web pages withmaximum ease and a minimum of fuss. Menu.Applet is designed to help even noviceusers create stunning Web sites and add impressive effects � without having to writea single line of code.

Why Java�-basedmenus?Menus rarely follow the one-level format of one parent item � many child items.More often than not, one menu item leads to more options, creating multi-levelmenus that would be difficult to lay out using traditional text and image�basedmethods, as these require all menu items to be displayed simultaneously. This resultsin increased Web page sizes and a cluttered appearance.

Java-based menus were developed to provide Web authors with an easy way to placemenus with 2 or more submenus by hiding submenu items and showing them onlywhen clicked. Not only are these menus functional; they are an eye-catching anddynamic element in anyWeb site.

Basic terminologyFollowing is a list of common terminology used throughout this user guide:

submenu items

Pop-up Menu example

menu item

3

Slider Menu expands its submenus by gliding its contents out from a specifiedpoint.

Mouse actions Events that take place when users perform specific mouse-relatedactions, such as mouseover and mousedown (see below). Common events includechange in text color, background image, text style or even the text itself.

Slider Menu example

Normal stateThe state when there isno mouse action.

Mouseover stateThe state when themouse pointer is placedon the menu item, but isnot clicked.

Mousedown stateThe state when the menu itemis clicked.

These menu items are all Parent items. Menus foundunder Children items are called submenus. Forexample, “2000” is a submenu of “Archives”.

These menu itemsare Sibling itemsof each other, andChildren items ofthe “2000” menuitem.

These menu itemsare Sibling items ofeach other, andChildren items ofthe “Archives” menuitem. “2000” is aParent item of theexpanded greenmenu.

4

Getting to know Menu.AppletTo help you get started, this section provides an initial overview of the Menu.Appletinterface. First, let’s look at a typical Menu.Applet workspace:

The Menu.Applet workspace contains three main panels: Item Tree View Panel,Properties Panel, and Compose/Preview Panel.

• Item Tree View Panel Displays the layout of the menu items in a flowchart diagramshowing the various menu items and submenus. Add menu and submenu items (childand/or sibling items) to your menu in this panel.

• Properties Panel Configure and customize the applet and menu items in this panel.Preferences for dimension, color, background and behavior of each item can be setusing this panel.

• Compose/Preview Panel Display the layout of your menu in two modes: Compose(layout only) or Preview (shows a running version). Correct errors, fine-tunesettings, and preview menus through this panel.

Item TreeView Panel

PropertiesPanel

Compose/ PreviewPanel

Note : You must have Microsoft Internet Explorer 4 or above to be able to preview your work inthe Preview panel.

5

1. Click File : New or press [CTRL + N] .

2. In the New Applet dialog box, select thetype of menu applet to create (Slider orPop-up), or click Template to open anexisting template.

3. A blank applet will be displayed. Itsattributes can be adjusted in theProperties Panel. The following sectionprovides further details on defining theapplet’s attributes.

• Dimensions The applet’s width andheight in pixels.

• Loading message The message thatwill be displayed while the applet isbeing loaded into the Web page.

• Smooth pop-up (Pop-up menu only)If enabled, the pop-up submenu willglide out on mouseover. Leaving thisbox clear will cause the entiresubmenu to be displayed instantly.

Applet Properties Panel: General Tab

The General Tab for Slider Menus is different from the General Tab for Pop-upMenus in that it has fewer options.

Slider Menu Applet Properties Panel: General Tab

Creating a new menu applet

Note :There are three tabs for Slider Menu: General , Background , and Options . For Pop-upMenu, only the General and Background tabs are available.

6

• Color Use a solid color for thebackground. Click the color square tochange the current color.

• Image Use an image as thebackground for your menu applet.

• Fit applet to image dimensionsRetain your image file’s originaldimensions and make the applet thesame size as the image.

• Tile Repeat the image throughout theapplet background if the imagedimensions are smaller than theapplet’s dimensions.

Background Tab

The Background Tab is identical for both Slider and Pop-up Menus.

Pop-up Menu Applet Properties Panel: General Tab

• Pop-up speed (Pop-up menu only)Only enabled if the Smooth pop-upcheck box has been selected. Thespeed of the gliding motion of thesubmenu can be specified here.Assign a low value to slow the slideeffect.

• Separator line (Pop-up menu only)When selected, each submenu isseparated by a thin line.

7

Options Tab (Slider menu only)

• Retain mousedown state Maintain amenu item’s mousedown state after ithas been selected. It will return to itsnormal state when another menu itemon the same level is selected.

• Enable submenu glide Makesubmenu items glide out when clicked.Leaving this box clear will cause theentire submenu to be displayedinstantly.

• Glide speed The speed at whichsubmenus glide out. Assign a lowvalue to slow the glide effect.

• Icon blink rate The rate at which theicon blinks when the glide setting isenabled. Assign a low value for a slowblink.

• Show all submenus Keep submenusexpanded even when other submenushave been clicked.

• Menu vertical position The anchorpoint from which the menu glides outwith reference to the top edge of theapplet.

• If a scrollbar is to be used, specify theWidth of the scrollbar between 5 and32 pixels.

Scrollbar options:

Always – A scroll bar is generated whetheror not it is required.

Never – The scroll bar is disabled.

Auto show/hide – Program detects if ascrollbar is required and generates oneautomatically.

8

Creating a new Slider menu

1. Select File: New or press [CTRL + N] .Select Slider Menu then click New.

Note : Click Template to use a pre-definedtemplate.

2. Set up the applet’s attributes using theProperties Panel.

Note : See pages 5 - 7 to know the differentsettings available on the Properties Panel.

3. In the Tree Level View panel, clickAdd Child Item or press[CTRL + D] to add the first menuitem of the applet. You can addadditional same-level items by either:

a. Selecting the Slider Menu applet atthe Tree View Panel then clickingEdit: Add Child Item , orpressing [CTRL + D] or

b. Highlighting the first Child Itemthen clicking the Add SiblingItem button, or pressing[CTRL + I] .

Note : Always select the parent menu itembefore making child items of the same level.If making sibling items from a child item,select the original sibling first.

4. You will be able to adjust the settingsof each item in the Applet PropertiesPanel. Following are details on how toadjust the settings in each tab.

9

Item Tab

• Caption The menu item’s text string.When Show Caption Text in Item isdisabled the text string is notdisplayed.

• URL The Web page address that isopened when the menu item isselected.

• Target The menu item’s hyperlinktarget frame.

• Status The message to appear in thebrowser’s status window onmouseover.

• Normal image The image file to bedisplayed as the default background ofthe menu item.

• Mouseover image The image file tobe displayed as the background of themenu item on mouseover.

• Mousedown image The image file tobe displayed as the background of themenu item on mousedown.

• Text attributes The level’s universalfont, size and style.

• Background sound The sound file tobe played when any menu item on thislevel is clicked. Click the folder icon toloacte the sound file.

• Outline Place a border on your menuitem on mouseover.

• Text indent The indentation of thesubmenu item’s text in reference to theleft border of the parent item’s text.

• Icon indent The indentation of thesubmenu item’s icon in reference to theleft border of the parent item’s icon.

• Item height The vertical space inpixels to be allocated to the menu item.The text will be vertically centered inits allocated space.

Level - General Tab

Specifications made to menu items onthis tab will apply to all items on thatmenu item’s level:

10

Level – Icon Tab

Icon settings determined in this tab willaffect all menu items on this level.Image files can be specified for icons toappear beside each menu item. Differenticons can be selected for menu itemswith no child submenus; menu items withunexpanded submenus; and menu itemswith expanded menu items.

Level – Event Tab

Click the color squares to select thecolors of the background and text for thedefault state, and for mouseover andmousedown events. Settings determinedon this level will affect the whole level.

Note : Select the Tile option to have theimage fill the the whole menu item’s allotedspace. This is useful when you are using apatterned or textured image.

11

Creating a Pop-up menu1. Select File: New or press [CTRL + N] .

Note : Click Template to use a pre-definedtemplate.

2. Specify the Applet’s general attributesusing the Properties Panel.

Note : See pages 5 - 6 to know the differentsettings available on the Properties Panel.

3. In the Tree Level View panel, clickAdd Child Item or press [CTRL+ D] to add the first menu item of theapplet. You can add additional same-level items by:

a. Selecting the Pop-up menu appletat the Tree View Panel and clickingAdd Child Item or pressing[CTRL + D] or

b. Highlighting the first Child Itemand clicking Add Sibling Item orpressing [CTRL + I] .

Note : Always select the parent menu itembefore making child items of the same level.If making sibling items from a child item,select the original sibling first.

4. Determine the settings of the firstgeneration child items using theProperties Panel. The followingsection describes the available settingsin further detail.

Note : Attributes for Child Items in pop-upmenus are determined individually.

12

• Normal The image to be displayed asthe menu item’s default background.

• Mouseover The image to be displayedas the menu item’s background onmouseover.

• Transparent background If enabled,the background will be transparent.

• Item position and size The menuitem’s X and Y coordinates at the topleft corner, relative to the applet.Specify also the height and width ofthe menu item in pixels.

Main Menu Tab (First level menu only)Item Tab

Define settings for individual menuitems:

• Caption The menu item’s text string.When Show Caption in Item isdisabled the text string is notdisplayed.

• URL The Web page address to beopened when the menu item isselected.

• Target The menu item’s hyperlinktarget frame.

• Status The message to be displayed inthe browser’s status window onmouseover.

• Submenu position The X and Ycoordinates of the starting position ofthe selected item’s submenu, relative tothe the top left corner of the selecteditem.

• Pop-up direction Use the arrows tospecify how the submenu pops upwhen the parent item is selected.

Specify an icon and icon attributes foreach child item:

13

• Text attributes The level’s universalfont, size and style.

• Margin left/right The size of the leftand right margins in pixels.

• Margin top/bottom (second level andabove menus only) The size of theabove and below margins in pixels.

• Background sound The sound (WAVor AU) file to be played when themenu item is clicked. Click the foldericon to locate the sound file.

Level - General Tab

Specify text and attributes for all childitems within the same level:

Level – Color Tab

Click the color squares to select thecolors of the background and text for theNormal state and for mouseover events.Also select the color of the borderaround menu items. Settings determinedon this level will affect the whole level.

14

Using HTML framesMenu.Applet offers the choice of using frames in a Web page, providing greaterflexibility when creating menus. Frames allow the menu to remain static while linksare opened in the adjoining frame. Expanded menu items will therefore remainexpanded while a selected link opens in the adjoining frame. Each frame can be givenits own URL, enabling each frame to be loaded individually.

• Use Frames Output an HTML fileusing frames.

• Vertical Split the browser windowvertically into two frames. Select oneof the two buttons to specify whetherthe menu should be in the left frame orin the right.

• Horizontal Split the browser windowhorizontally into two frames. Selectone of the two buttons to specifywhether the menu should be in the topframe or in the bottom.

• Menu frame The name of the frame inwhich the menu is displayed.

• Open undefined targets in theContent frame Make target URLsopen in the adjoining frame.

• Content frame If the Openundefined targets in the Contentframe option is enabled, assign aname to the Content frame.

Note : Giving the frame a name will allowthat frame to be targeted by other URLs.

15

Saving your workMenu.Applet files can be saved in two different ways; either as project files or asHTML files. Project files contain information about source images and settings.These can be opened again for editing at a later time. Java™ files are the final outputthat will be seen on your Web page.

To save a Menu.Applet project file:

1. Click File: Save As or Save on theStandard Toolbar.

2. Locate the folder where you want tosave your project file. Assign a nameto the project. The file extension forMenu.Applet files is UMA.

3. Click Save.

To update existing Java components orinsert a new component in an existingHTML file:

1. Click File: Update HTML.

2. Locate the HTML file to be updated.

3. Select the file and click Open.

To save your work as Java:

1. Click File: Save as HTML or OutputHTML on the Standard toolbar.

2. Locate the folder where you want tocreate a new HTML file. Assign aname to the new HTML file.

3. Click Save.