区域地图不起作用

时间:2017-06-26 19:31:18

标签: html imagemap

我有一个homescreen image,我需要链接不同的网站,但仍然无法使我的区域地图有效。我尝试重新排序并仔细检查拼写。我还仔细检查了坐标。想法?

<p><map name="epacbanner"> 
<area shape="rect" coords="0,336,156,489" href="https://www.google.com" 
alt="contact" />
</map> <img src="/content/epac%20banner_final.png" alt="epac banner" 
title="epac banner" width="960" height="322" img="" usemap="#epacbanner" />
</p>

1 个答案:

答案 0 :(得分:1)

问题不在于您的HTML而是坐标值,因为您指定了rect前两个坐标是形状左上角的x,y位置。当您的图片实际上只有336像素高(高度)时,您已为y值指定322。将该值更改为0会在左上角放置一个矩形样本图像如下面的第二个例子所示。

<p>
<img src="http://lorempixel.com/960/322" alt="epac banner" 
  title="epac banner" width="960" height="322" usemap="#epacbanner" />
  <map name="epacbanner">
    <area shape="rect" coords="0,336,156,489" href="https://www.google.com" 
  alt="contact" />
  </map>
  
</p>

<p>
<img src="http://lorempixel.com/960/322" alt="epac banner" 
  title="epac banner" width="960" height="322" usemap="#epacbanner" />
  <map name="epacbanner">
    <area shape="rect" coords="0,0,156,489" href="https://www.google.com" 
  alt="contact" />
  </map>
  
</p>