So, I wanted to created a clickable map for the regions of Utah. I don’t want don’t want to use the tag because I want the individual regions to be the exact shape of the region and not a square (maybe there is a way to make a layer a slice, but I’m not aware of that). Each region is currently its own layer in photoshop. Should I have done this in photoshop? I’d also like to change the color of each layer when it is hover over and when it is the currently selected region.
It will still create a map as sugested by @bluedreamer. The difference is that Photoshop (or Fireworks, if you use that) would do the coding for you.
Most of the experienced coders want to have more control over their work and prefer to create the shapes and then code it themselves. Code is supposed to be cleaner and easier to maintain than any automation that you can use.
I think that I only did this once and I think I used the slicing tool… Not 100% sure because that was a long time ago
Can you create hover overs and highlight layers when a given section is clicked/selected? I don’t believe that you can and that’s why I don’t want to use image maps.
Yes, you can. You can use CSS and Javascript as with any other element. A map element is, after all, a HTML element and any HTML element can be manipulated with CSS and Javascript
I thought that maps were just used on one whole image? I know you can create polygon maps, but matching them specifically to individual layers in an image can be difficult. Maybe there is a good way to do this.
You can do this pretty nicely even just with a series of CSS sprites. As you hover over a state, the hover image for that state kicks in. The only downside is that the clickable area is still rectangle, so there’s a bit of give and take in terms of the boundaries, but most people will not try to select a state by hovering right on the edge. I had a go at this a few years ago with a world map, and it worked pretty well, I think.
