MX

The MouseOff and MouseOver Layers
All the main objects on your website are placed on the bottom layer, usually called MouseOff. Buttons
that highlight when you move the mouse over them on the web page have an alternative graphic on the
layer called MouseOver
.
If you open the Page & Layer Gallery
you can show or hide any layer by checking or un-checking the visibility icon (the eye symbol). This is a
way of showing what your MouseOver elements will look like on your page.
The current layer is always highlighted in the Page & Layer Gallery - the MouseOff layer in the above
diagram - and this is the layer that all new objects are drawn on. To place objects on any other layers
just click the required layer in the Page & Layer Gallery
, ensure the eye and the lock icon are open for that layer.
Note
: The MouseOver layer must always be above, that is on top of, the MouseOff layer, as shown in the
above example.
To edit the objects on a layer both the 'eye' and 'lock' icons have to be open - this means you can see
and edit the layer (as shown above in the MouseOff layer).
Mouseover (Rollover) Buttons
Almost all the ready-made buttons from the Designs Gallery
have a mouseover effect in Web Designer Premium. These are created by having two versions of each
button, the main one on the MouseOff layer and a 'highlight' one on the MouseOver layer.
Normally you do not need to know or care about this because both buttons behave as one - the changes
you make to one, such as editing the label text, are reflected on the other version. If you move, drag or
resize a button on the MouseOff layer, the other version on the MouseOver layer will change as well,
even if you can't see it. This is done using Soft Groups (Soft Groups, Soft Groups
).
Creating Your Own Mouseover Buttons
You can create your own mouseover buttons from scratch by drawing the necessary elements from
rectangles, text, etc. Just draw the main parts of the button on the MouseOff layer (remember to group it
) and place the corresponding 'highlight' version on the MouseOver layer. As long as the MouseOff
version has a web address link, then the MouseOver version will automatically be displayed as you move
the mouse over it on the web page. (The MouseOver layer must be on top of the MouseOff layer).
In other words, you give the main object a web address using the link
option, and then select the MouseOver Layer in the Page & Layer
Gallery
Page 172