0

what I am trying to do is to create menu, instead of links, a clickable image. However, these images are parallax layers. How should I approach this ? Should the clickable images be on separate layers ?

This is the image I am going to use. I would like that tower in background to take you to gallery, but at the same time, that layer, as mentioned will be parallax.

enter image description here

Any ideas ?

Filip5
  • 67
  • 1
  • 10

1 Answers1

0

It's probably a good idea if you create a separate parallax layer that contain absolute positioned links as a form of navigation. If you strictly want to map certain areas on the image as links, you might want to use a tag as in this example taken from 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>

The shape defines the type of area of each clickable area, the coords define the perimeter of said areas; the href attributes define where the page navigates if said area is clicked.

To achieve this with a non-basic shape, you can set the type to "poly" and then set the polygon's each anchor point's coordinates as such:

<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.">
Adam Karacsony
  • 151
  • 1
  • 9
  • But these are primitive shapes, aren't they ? Can I also use custom shapes ? – Filip5 Feb 22 '17 at 12:51
  • Adjusted my answer to include a solution to achieve custom map area shapes – Adam Karacsony Feb 22 '17 at 13:00
  • I will give this a try and let you know – Filip5 Feb 22 '17 at 13:11
  • I do get it using shapes, but is this going to cope with parallax ? Coords are changing when using parallax so I don't think this will be the best solution – Filip5 Feb 22 '17 at 13:22
  • This will make clickable areas on the image that are fixed to the image so they should move together. If you want to have the clickable areas move parallax to the image, you'll need to make a new parallax layer only for the navigation, so that would need a different approach. – Adam Karacsony Feb 23 '17 at 09:10