HTML 图像映射不显示工具提示答案

【问题标题】：HTML Image Map Not Displaying TooltipsHTML 图像映射不显示工具提示
【发布时间】：2017-01-13 13:10:12
【问题描述】：

我的图片在网页上显示正常。但是，将鼠标悬停在图像的任何部分上时，工具提示中只会显示第一个区域标题。其他区域不会显示。这是我的html。

<html>

<map name="eyfsplayarea">
  <area shape="circle" coords="930,300,70" alt="The Mud Kitchen and Digging Zone" title="The Mud Kitchen and Digging Zone">
  <area shape="circle" coords="790,200,50" alt="The Niagara Channelling System, Water Table and Water Wall" title="The Niagara Channelling System, Water Table and Water Wall">
  <area shape="circle" coords="890,180,20" alt="The Sand Tray" title="The Sand Tray">
  <area shape="rect" coords="323,150,850,100" alt="A Sheltered Covered Area Linked to the Building" title="A Sheltered Covered Area Linked to the Building">
  <area shape="circle" coords="600,200,40" alt="A Roadway, Numeracy and Literacy Zone" title="A Roadway, Numeracy and Literacy Zone">
  <area shape="circle" coords="400,300,70" alt="Physical Development and Role Play Zone" title="Physical Development and Role Play Zone">
  <area shape="circle" coords="690,300,90" alt="Physical Development and Role Play Zone" title="Physical Development and Role Play Zone">
  <area shape="circle" coords="246,612,104" alt="The Storytellers Chair, Phonics and Mark Making Zone" title="The Storytellers Chair, Phonics and Mark Making Zone">
  <area shape="circle" coords="244,190,54" alt="Role Play House with Chalkboard" title="Role Play House with Chalkboard">
  <area shape="circle" coords="593,615,105" alt="Den Posts" title="Den Posts">
  <area shape="circle" coords="1360,619,93" alt="The Language Lounge" title="The Language Lounge">
</map>

<img src="/EYFS-Outdoor-Play-and-Learning2.jpg" width="1621" height="725" alt="EYFS Play and Learning" usemap="#eyfsplayarea">

</html>

【问题讨论】：

鉴于您的源图像，您的坐标实际上是不可能的。
@Dr.Avalanche 好地方，非常感谢。我已经用正确大小的图像对此进行了修改，但这不是唯一的问题，我遇到了同样的事情。有什么想法吗？
请用更正的尺寸更新您的帖子，因为您的 html 仍在使用不存在的坐标
@Dr.Avalanche 好的，现在全部更新！
你的圆圈和矩形是错误的。圆圈有x,y,radius，矩形有x1,y1,x2,y2

标签： html tooltip imagemap

【解决方案1】：

这个问题的答案是，图像地图中的circle 区域具有三个值，即圆的x 位置、y 位置和radius。在编辑之前，它们的参数数量与矩形相同，后来它们的半径值大于源图像。

【讨论】：