Server-Side Image Maps in HTML

Q

What Is a Server-Side Image Map?

✍: FYIcenter.com

A

A server-side image map is an image inside a hyper link. The image must be defined with the "ismap" attribute in the "img" element. When a server-side image map is clicked in a browser window, the mouse coordinates will be delivered to the server by them to the end of the URL of the link in the format of "?x,y".

Here is a tutorial example with a server-side image map:

<?xml version="1.0" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
 <head>
  <title>Server-Side Image Map</title>
 </head>
 <body>
  <h4>Inline Images</h4>
  <p style="background-color: #eeeeee; padding: 8px;">
   This is a server-side image map test. 
   <a href="http://localhost/mapping?var=val">Click this
   image <img src="/moonrise.jpg"" alt="Moonrise"
    width="69" height="91" ismap="ismap"/>
   to see what happens.</a> Use browser back button to 
   come back.</p>
 </body>
</html>

If you save the above document as server_image_map.html, and view it with Internet Explorer, you will see an image in a hyper-link as shown below:

HTML img Element - Server-Side Image Map

⇒ Client-Side Image Maps in HTML

⇐ Animated Images in HTML

⇑ HTML Inline Images and Image Maps

⇑⇑ HTML Tutorials

2017-03-22, 2075👍, 0💬