Question

我正在尝试创建一个图像映射，格式化，以便在单击地图上的某个区域时，浏览器会在新选项卡中打开所选链接。

我知道使用target_blank属性来执行此操作，这在我将特定图像用作“按钮”时有效。但我无法弄清楚如何让它在图像地图上工作。

附带的代码可以很好地用作图像映射，但我希望包含在新选项卡中打开链接的功能。

以下是代码：

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
  </head>
  <body>
    <div>
       <map name="pdx">
         <area href="https://en.wikipedia.org/wiki/Main_Page" alt="wiki"
target="_blank" shape="rect" coords="300,200,400,800"> 
      </map>
   </div>
   <p>
       <img src="/1st-stark1852WebCover.jpg" width="1800" alt="pdx_1852"   usemap="#pdx"/>
   </p>
</body>
</html>

Answer 1

我无法使用您的图片，因为它不可用。

地图不会添加到评论中提到的div中，需要使用区域标记然后it works well。

这里有stackoverflow图标，链接在随机矩形上。

  <div>
       <map name="pdx">
         <area href="https://en.wikipedia.org/wiki/Main_Page" alt="wiki"
target="_blank" shape="rect" coords="100,100,200,200"> 
      </map>
   </div>
   <p>
       <img src="https://cdn.sstatic.net/Sites/stackoverflow/img/apple-touch-icon@2.png?v=73d79a89bded" width="400" alt="pdx_1852"   usemap="#pdx"/>
   </p>

由于我不知道你在哪里运行它，请记住，像你编写此类代码的网站这样的游乐场会阻止链接工作。像SO一样......

＆＃13;

      <div>
           <map name="pdx">
             <area href="https://en.wikipedia.org/wiki/Main_Page" alt="wiki"
    target="_blank" shape="rect" coords="100,100,200,200"> 
          </map>
       </div>
       <p>
           <img src="https://cdn.sstatic.net/Sites/stackoverflow/img/apple-touch-icon@2.png?v=73d79a89bded" width="400" alt="pdx_1852"   usemap="#pdx"/>
       </p>

＆＃13;

HTML无法让“target_blank”在图像映射中工作

1 个答案: