Overlaying Graphics
Using layers to place an image over text or other images
How to place an arrow between two points
This exercise places an arrow between here and Image-2 below. Hover the mouse here to see the arrow.
This example works best when the font-size is fixed, and the user does not adjust it. Unfortunately, users cannot be stopped from adjusting font sizes to suit their own needs. For example, the user may need larger fonts to see the text, or to compensate for a very high resolution screen on a small Tablet PC.
- Create the arrow to the approximate size and direction in an image editor and save somewhere on the computer. Do not use graphics from the FrontPage Drawing Toolbar - see vml-graphics for reasons why.
- Import the image into the website.
- Open FrontPage and the website, then open the page.
- Create a layer - Insert->Layer. The layer must not be created within a table cell.
- Move the layer, and resize it, until it fits between the two points of the page where the arrow is to be placed. Bear in mind that if the font size is changed, the endpoints of the arrow will change, but the arrow itself will remain fixed in the same position. The arrow will have to be "flexible". Use View->Text Size and change the font size to see what happens in this page.
- Drag the image into the layer from the folder list, and adjust the image size to fit.
- Adjust the layer size to fit the image. Often deleting the height and width is the easiest way.