无法使地图标记正常工作

时间:2017-12-18 14:10:49

标签: html css imagemap

我很难让映射标签正常运行图像。想知道是否有人可以看一看,看看我做错了什么。 我遇到的问题是让地图出现。图像全部加载正常,但是当我映射和链接某个部分(或整个图像)时,没有任何内容出现。

HTML:

<div id="leftColumn">
<img src="/img1.jpg"><br><br>
<img src="/img2.jpg"><br><br>
<img src="/img3.jpg" usemap="#Map2" border="0">
<map name="Map2">
<area shape="rect" coords="80,298,371,377" href="www.SomeSite.com">
</map><br><br>
</div>

CSS如果重要:

#leftColumn {
    height: 100%;
    width: 61%;
    float: left;
}

我认为这是正确的但是从Dreamweaver到实际网站的某些东西是不是正确地做了这些?我不知道,但我一直坚持这个..

1 个答案:

答案 0 :(得分:0)

可能有几个问题:

  • 图片文件链接在网络服务器的根目录中,试试./img3.jpg
  • 确保映射图像的尺寸大于地图坐标,即在这种情况下为298x377 px
  • 将div#leftColumn设置为宽度:61%;什么?,图像适合那个宽度?

修改

  • 图像为1530 x 380像素(固定尺寸)
  • 您的地图有291 x 79像素(固定尺寸)
  • 图像处于动态调整大小的元素中,占父元素宽度的61%

解决方案:
   - 保持图像/父元素的固定大小..    - 放大地图尺寸