Question

我有一个映射图像的一部分，我想发起一个画廊（漂亮的照片插件）。但是，看起来'area'标签不支持'rel'属性？不幸的是，这是我启动画廊的唯一途径。我在下面附上了我的尝试（不成功）。有什么建议吗？

 <area shape="rect" coords="32,567,435,810" href="images/gallery_01.jpg" rel="prettyPhoto" title="Preview" />

Answer 1

由于您只是在图像地图上使用直角坐标，而是可以使用定位在同一位置覆盖支持rel的标记：

<div id="wrapper">
  <img src="your_image_map.jpg" />
  <a href="images/gallery_01.jpg" rel="prettyPhoto" title="Preview"> </a>
</div>

#wrapper { position:relative; }
#wrapper a {
  width:403px; height:243px;
  position:absolute; left:32px; top:567px;
}

Answer 2

您可以使用prettyPhoto API打开图像地图中的内容。

您的代码看起来像：

 <area shape="rect" coords="32,567,435,810" href="images/gallery_01.jpg" onclick="$.prettyPhoto.open('path/to/your/image.jpg','Title','Description'); return false" title="Preview" />

可在此处找到完整的文档：http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/documentation/

Answer 3

我发现了一些可能对你们有用的东西。这就是我在div中打开外部链接所做的工作

<div class="whatever"  href="javascript:void(0)" onclick="$.prettyPhoto.open('http://whatever');">
</div>

您可以在此处查看结果http://fbc.net，然后点击“发送”

＆＃39;相对。＆＃39;在地图内标记？

3 个答案: