HTML ismap Attribute
Description
The ismap
attribute is used in HTML to specify that an image is part of a server-side image map, which is a type of image that has clickable regions. The attribute itself is a boolean attribute, meaning its presence on an <img>
element indicates a true value, and it doesn't require a specific value to be assigned.
When an image is used with the ismap
attribute, it typically requires the user to click on a specific area of the image. Upon clicking, the coordinates of the click (relative to the top-left corner of the image) are sent to the server as part of the URL query string. This functionality allows the server to determine which part of the image was clicked and respond accordingly, often by redirecting the user to a new page or displaying content related to the clicked area.
For the ismap
attribute to work effectively, the <img>
element it is applied to must be wrapped within an <a>
(anchor) element with a valid href
attribute. The URL specified in the href
attribute is the server-side resource that will process the click coordinates. The process of clicking on different areas of the image and being directed to different URLs based on those clicks is what defines a server-side image map.
Here's a basic example of using the ismap
attribute:
<a href="/process-image-map">
<img src="image-map.png" alt="Server-Side Image Map" ismap>
</a>
In this example, when the user clicks on the image, the browser automatically appends the click coordinates to the URL specified in the href
attribute of the surrounding <a>
tag. The server-side resource at /process-image-map
can then use these coordinates to perform specific actions, like redirecting to a different page or displaying specific content.
The ismap
attribute is a simple yet powerful tool for creating interactive images on web pages, but it's important to note that it relies on server-side processing to function. Additionally, for more complex or interactive image maps, web developers might opt for client-side image maps using HTML and JavaScript, which do not require the ismap
attribute.
Syntax
<img ismap>
Values
The ismap
attribute is a boolean attribute, therefore no values are associated with this attribute.
Applies To
The ismap
attribute can be used on the following html elements.
Example
<a href="ismap_form.php">
<img src="images/sunset.jpg" alt="Sunset" ismap>
</a>
Browser Support
The following table will show you the current browser support for the HTML ismap
Attribute.
Desktop | |||||
12 | 1 | 1 | 15 | 3 |
Tablets / Mobile | |||||
18 | 4 | 14 | 2 | 1 | 4.4 |
Last updated by CSSPortal on: 28th March 2024