Tweet
BlueVoda 8.0: How to use the image maps
You can create an (client-side) image map that divides an image into different areas that each link to a different web page.
Creating an image map is useful for images such as a floor, campus map or world map that you want to contain links to different pages.
You can define each clickable area (hotspot) on the map using three shape values: rectangle, circle or polygon (irregular shape).
To add images use the Image map object. Drag the object to the page and a file dialog will popup to select the image.
BlueVoda supports jpg, gif, and bmp files.
Filename: enter the path and filename of the image/picture or select Browse to find an image on your local drive.
Alternate text: this text, usually a short description, appears in place of the object in browser when images are unsupported or have been disabled. In some browsers it appears as a ToolTip when you move the mouse over the image.
Use original size: Select this if you want the image to appear at it's orginal size.
Fit to layout rectangle: Select this if you want to manually specify the image size.
Border thickness: Specifies the thickness of the border around the image. Set this to 0 (zero) for no border.
Border Color: Specifies the color of the border around the image.
Adding Hotspots
There are two ways to add hotspots to an image map:
1. Manually entering the coordinates in the hotspot tab of the image map properties
2. Visually modifying the coordinates using the mouse
Manually entering the coordinates
Open the image map properties and click the Hotspots tab to insert the coordinates of an hotspot.
You can insert 3 types of hotspots:
a) Circle
Here you enter the x and y coordinates of the center and the radius of the circle.
b) Rectangle
Here you enter the x (left) and y (top) coordinates and the width and height of the rectangle.
c) Polygon (Irregular Shape)
Here you enter each point (x, y coordinates) on the polygon.
Visually modifying the coordinates using the mouse
A more efficient way to modify the coordinates of the hotspots is by visually dragging them.
a) Right click the image map to display the context menu
b) Select the hotspot type you want to insert (Add Circle Hotspot, Add Rectangle Hotspot or Add Polygon Hotspot)
c) A window will popup where you can set the initial coordinates, the URL and alternate text of the area. By default BlueVoda will insert the shape in the center of the image map.
d) After you have clicked OK, the shape will be inserted to the image map, you can now select it and drag it around or change it's size using the size handles.
e) To edit or remove the hotspot, right click the area to display the context menu and select Edit Hotpsot or Delete Hotspot.
Creating an image map is useful for images such as a floor, campus map or world map that you want to contain links to different pages.
You can define each clickable area (hotspot) on the map using three shape values: rectangle, circle or polygon (irregular shape).
To add images use the Image map object. Drag the object to the page and a file dialog will popup to select the image.
BlueVoda supports jpg, gif, and bmp files.
Filename: enter the path and filename of the image/picture or select Browse to find an image on your local drive.
Alternate text: this text, usually a short description, appears in place of the object in browser when images are unsupported or have been disabled. In some browsers it appears as a ToolTip when you move the mouse over the image.
Use original size: Select this if you want the image to appear at it's orginal size.
Fit to layout rectangle: Select this if you want to manually specify the image size.
Border thickness: Specifies the thickness of the border around the image. Set this to 0 (zero) for no border.
Border Color: Specifies the color of the border around the image.
Adding Hotspots
There are two ways to add hotspots to an image map:
1. Manually entering the coordinates in the hotspot tab of the image map properties
2. Visually modifying the coordinates using the mouse
Manually entering the coordinates
Open the image map properties and click the Hotspots tab to insert the coordinates of an hotspot.
You can insert 3 types of hotspots:
a) Circle
Here you enter the x and y coordinates of the center and the radius of the circle.
b) Rectangle
Here you enter the x (left) and y (top) coordinates and the width and height of the rectangle.
c) Polygon (Irregular Shape)
Here you enter each point (x, y coordinates) on the polygon.
Visually modifying the coordinates using the mouse
A more efficient way to modify the coordinates of the hotspots is by visually dragging them.
a) Right click the image map to display the context menu
b) Select the hotspot type you want to insert (Add Circle Hotspot, Add Rectangle Hotspot or Add Polygon Hotspot)
c) A window will popup where you can set the initial coordinates, the URL and alternate text of the area. By default BlueVoda will insert the shape in the center of the image map.
d) After you have clicked OK, the shape will be inserted to the image map, you can now select it and drag it around or change it's size using the size handles.
e) To edit or remove the hotspot, right click the area to display the context menu and select Edit Hotpsot or Delete Hotspot.
Comment