Clickable Geographical Map Regions - Caution, Animation, Conclusion
(Page 4 of 4 )
Caution
Note that we have used three text editor windows: one to create the coordinates for the regions, one on which we just placed the coordinates, and one for the web page to be hosted. Now, you may be using an IDE or Studio or some other software to create your web page. If you copy the coordinates from the window and then paste it on the code page of your IDE, the coordinates may be pasted with additional symbols. These symbols come from the opened browser window, even though you did not see them there.
To avoid this problem, paste the coordinates first to a text-editor's window. The text-editor does not receive these symbols, so it does not display them. You then copy the coordinates as they should be, from the text-editor onto the code page of your IDE.
Animation
By animation, I am referring to a situation in which, if you place your mouse pointer over a geographical region, the region may change its color or develop a border. The image-map specification does not really give you facilities to do this. Even though the AREA element has a style attribute, which means that you can give the area element borders or some other style through a style sheet, browsers do not support this.
Therefore, you cannot animate image-maps through the style attribute. If you really want to animate, then you can use CSS layers of the same image. This is the subject of another article.
Conclusion
You can make regions of a geographical map in a web page clickable so that they will open new web pages. You do this using HTML image-maps and JavaScript. To animate these regions with today's browsers, use CSS layers and JavaScript. Animation, however, is a subject for another article.
| DISCLAIMER: The content provided in this article is not warranted or guaranteed by Developer Shed, Inc. The content provided is intended for entertainment and/or educational purposes in order to introduce to the reader key ideas, concepts, and/or product reviews. As such it is incumbent upon the reader to employ real-world tactics for security and implementation of best practices. We are not liable for any negative consequences that may result from implementing any information covered in our articles or tutorials. If this is a hardware review, it is not recommended to open and/or modify your hardware. |
