| Scenario: A vertical menu must be placed
inside a cell where its left position can vary depending on the
browser's window size (Floating mode) Let's consider this page layout
where we have an image (perhaps, the logo of our company), two
cells underneath where the leftmost one will contain our menus
and the other our HTML contents.
| Try to increase this
window's size as much as possible to ensue that the sample
layout is fully displayed. |
As you can see, this is a very common design for a simple web
site and yet, placing the menus at the correct spot (inside the
dark blue cell) can be quite tricky.
First of all we need to define the properties of our design. There's
only one important thing to consider here:
- The layout is centered which makes all the cells in the
table change their horizontal position as the browser window
is resized.
This makes positioning the menus quite difficult because the
position of the cell where we want to place the menus will
vary depending on the browser's window size and we will never
know, for sure, what offset to apply. In this case DHTML Menu
Builder provides a method for attaching the menus to an element
inside that cell. This will cause the menus to follow this
element (which is usually an image) thus guaranteeing that the
menus are always properly positioned. Click the continue
button to learn how to attach a toolbar to an image so it
follows the image position.
Continue » |