| Web Menus |
Expand Menu Studio
*NEW* Construct and maintain multi-level menus with this complete menu solution. Includes a menu editor and 50 menu design templates.
Read More...
Mercury Buttons
Dynamically build graphical web buttons and tabs in just minutes. No images required!
Read More...
Fission Menu
Quickly turn a single image into a stylish themed panel of web buttons with the minimum of effort!
Read More...
eXpand
The classic 2-level menu applet. Dynamically expand sub-menus as you move over top-level menus.
Read More...
|
| Banners |
Spotlight Banner
Create fantastic eye-catching lighting effects with the Spotlight applet.
Read More...
|
| Security |
Abstract e-mail
Abstract offers a truly simple solution to protecting e-mail addresses on your site.
Read More...
|
|
|
 | 3. Button Layout | |
3.1 Orientation The first design decision you will need to make is the orientation of your buttons. They can either be vertically or horizontally aligned. In most cases, the shape of your image will normally dictate the type of orientation you use - a tall image will generally have vertically orientated buttons, and a wide image will generally have horizontally orientated buttons.
The orientation is set through the Orientation parameter value. This will need to be set to '0' for a vertically orientated set of buttons, or '1' for a horizontally orientated set of buttons. The following sample script is setting horizontal alignment:
| |  | <param name="Orientation" value="1"> <param name="Spacing" value="3"> <param name="TopMargin" value="80"> <param name="BottomMargin" value="20"> <param name="LeftMargin" value="20"> <param name="RightMargin" value="20">
|  |
| |
3.2 Margins Having decided upon your button orientation, the placement of your buttons will then rely on these four parameter values:
TopMargin BottomMargin LeftMargin RightMargin
These parameters represent pixel values and they are combined together to determine your button placement. This diagram shows how they are interpreted to display a horizontal row of buttons along the base of the image:

The example above used the same value (20 pixels) for the LeftMargin, RightMargin and BottomMargin parameters. Then a much larger value (80 pixels) was used for the TopMargin parameter.
This sample script shows an example of these parameter values:
| |  | <param name="Orientation" value="1"> <param name="Spacing" value="3"> <param name="TopMargin" value="80"> <param name="BottomMargin" value="20"> <param name="LeftMargin" value="20"> <param name="RightMargin" value="20">
|  |
| |
3.3 Spacing The final aspect of button placement is specifying how far apart each button is. This is achieved through the Spacing parameter value.
This sample script shows an example of spacing the buttons apart by 3 pixels:
| |  | <param name="Orientation" value="1"> <param name="Spacing" value="3"> <param name="TopMargin" value="80"> <param name="BottomMargin" value="20"> <param name="LeftMargin" value="20"> <param name="RightMargin" value="20">
|  |
| |
|
|
|