|
Definition and Usage
The
The
Note:
The Applies to
The
Browser Support
The
|
How to add An image map, with clickable areas - HTML usemap Attribute
Click on the banner, the phone, or the cup of coffee to go to a new page and read more about the topic.
index.html
Example:
HTML
<img src="planets.gif" width="145" height="126" alt="Planets" usemap="#planetmap">
<map name="planetmap"> <area shape="rect" coords="0,0,82,126" href="sun.htm" alt="Sun"> <area shape="circle" coords="90,58,3" href="mercur.htm" alt="Mercury"> <area shape="circle" coords="124,58,8" href="venus.htm" alt="Venus">
</map>
Output should be:
How to add An <object> element using an image map - HTML usemap Attribute
Note: The usemap attribute of the object element is not supported in Chrome, Edge, Safari, and Opera.
index.html
Example:
HTML
<!DOCTYPE html>
<html>
<body>
<h1>The object usemap attribute</h1>
<object data="https://horje.com/avatar.png" width="145" height="126" usemap="#planetmap"></object>
<map name="planetmap"> <area shape="rect" coords="0,0,82,126" alt="Sun" href="sun.htm"> <area shape="circle" coords="90,58,3" alt="Mercury" href="mercur.htm"> <area shape="circle" coords="124,58,8" alt="Venus" href="venus.htm">
</map>
<p><b>Note:</b> The usemap attribute of the object element is not supported in Chrome,
Edge, Safari, and Opera.</p>
</body>
</html>
Output should be:
| html usemap attribute |
| How to add An image map, with clickable areas - HTML usemap Attribute | HTML Attribute |
| How to add An <object> element using an image map - HTML usemap Attribute | HTML Attribute |
|
Type
: |
Develop |
|
Category
: |
Web Tutorial |
|
Sub Category
: |
HTML Attribute |
|
Uploaded by
: |
Admin |
Read Article https://horje.com/learn/1434/reference