视差上的可点击图像

时间:2017-02-22 11:35:22

标签: javascript css menu parallax layer

我要做的是创建菜单,而不是链接,一个可点击的图像。然而,这些图像是视差层。我该怎么做呢?可点击图像应该在不同的图层上吗?

这是我要使用的图像。我想在背景中的那座塔带你去画廊,但与此同时,所提到的那层将是视差。

enter image description here

有什么想法吗?

1 个答案:

答案 0 :(得分:0)

如果您创建一个单独的视差图层,其中包含绝对定位链接作为导航形式,那么这可能是一个好主意。如果您严格要将图片上的某些区域映射为链接,则可能需要使用此示例中的标记,该标记取自here

<img src="planets.gif" width="145" height="126" alt="Planets" usemap="#planetmap">

<map name="planetmap">
  <area shape="rect" coords="0,0,82,126" href="sun.htm" alt="Sun">
  <area shape="circle" coords="90,58,3" href="mercur.htm" alt="Mercury">
  <area shape="circle" coords="124,58,8" href="venus.htm" alt="Venus">
</map>

形状定义每个可点击区域的区域类型,线圈定义所述区域的周长; href属性定义了单击所述区域时页面导航的位置。

要使用非基本形状实现此目的,您可以将类型设置为&#34; poly&#34;然后设置多边形的每个锚点的坐标如下:

<area shape="poly" coords="450,25,435,60,400,75,435,90,450,125,465,90,500,75,465,60" href="yellow.html" alt="Yellow star.">