Sense, and that the user will be able to recognise where those shapes might be on the map. No major browsers understand percentage coordinates correctly, and all interpret percentage coordinates as pixel coordinates.įor now, I will concentrate on the AREA element, but just remember that the SHAPE andĬOORDS attributes also apply to links inside the map (although again, I recommend that you do not use them).įirstly, you need to plan what shapes you intend to use, and where they will go.Internet Explorer does not understand the default shape.They will usually be displayed in the order that theyĪre defined in the source, so make sure that it makes sense. Text that should be displayed as the link content in these browsers. To allow them to display the areas, each AREA needs the ALT attribute set, giving the Browsers that cannot display image maps generally display a list of all the links and areas inside They remain invisible, and only create an area of the map Think the idea that a map should be inline is wrong, considering the way it is used, but that is what the spec says.Īreas are not rendered visually if image maps are supported. The map, I recommend you only put it where it makes sense, since it will be rendered, and also only put it inside anĮlement where that sort of content is allowed (such as inside a DIV or LI element). If you intend to use normal block level content inside The AREA element should be treated as a block level element, and must be directly inside the MAPĮlement, not inside any of the other block level content inside it. Image maps can be placed anywhere in the document (inside elements where inline content is allowed), and can be before Majority of Web users cannot use these A areas, I recommend you stick with basic areas. This capability is not well supported, and Internet Explorer in particular does not support it. You to use part of the normal content as the map areas, hopefully ending up with a more accessible document. Same way as AREA elements, so they can have the AREA and COORDS attributes. Any links within the block level content will be interpreted by the map in the The block level content will always beĭisplayed, even if image maps are supported. Note in theory, the map can contain a mix of AREA elements, and block level content. The MAP is a little strange, since it is an inline element, but it can Use the map should have their USEMAP attributes set to the same as the map name, with a '#' character in front This is created using the MAPĮlement, which must have a NAME attribute set, with a name that will be used to reference the map. There areįour types of these areas rectangles, circles, polygons and default.įirstly, you need to create the map that will be associated with the image. Useful, as opposed to the server-side image map where they must wait for the reply from the server to tell them. This gives the user the chance to see immediately if where they are about to click is somewhere With a client side image map, you can specify a list of areas that Internet Explorer only understands image maps that use AREA elements, not A elements.Ĭlient side image maps are generally more popular.If the user is not using a mouse (or equivalent), then the coordinates will be 0,0. Link, and add ?x,y on the end of it, as the click offset from the left,top corner of the image (such asįoo.html?47,8).
When the link is clicked, the browser will request the given IMG (just the name, it does not need a value). There are two types of image maps server side andįor a server side image map, put an image inside a link, and set the ISMAP attribute on the Image maps allow you to make certain areas of an image into links. Your navigation prettier, then you are using them for the wrong reason, and you should use a normal list styled with CSS. If you plan to make an image map out of a list of words just to make
The map gives information about the relevant area. Restrict their use to places where they are really appropriate, such as (surprise) a map, where clicking on the parts of Note that image maps can cause significant accessibility problems (and can be hard work to maintain), so you should
0 kommentar(er)
