Add button to image?

[nippynoo]

So I got a web page consisting of a single photographic image with a few buttons simply drawn on it. Whats the easiest way to make the button areas active,so that they load up a new page? Some code would be great Thanks!

 

[GravyMonster]

Either slice the buttons out in photoshop and rebuild it using HTML, or use an imagemap.

First is the proper way, second is a lot quicker

 

[gord]

Depends entirely on your image.

You could use an image map for the clickable areas. http://www.w3schools.com/TAGS/tag_map.asp

You could also use your image as a background and then position markup over that as the clickable areas. So:

<div style="background-image: url">
<a href="link" style="position: relative; top: ?px; left: ?px"></a>
</div>

I think slicing will be overkill for this.

 

[RoyMi6]

It's been said but I agree with Spunkey, image maps a are a bit old hat these days. Saying that not really sure why, they have their uses.

Anyway, Image Map will probably easier for you and there are some online tools that help you create then. All you have to down is copy and paste the code into your site.

A quick Google brings up these two:
http://www.image-maps.com/
http://www.maschek.hu/imagemap/imgmap - this one I've actually used myself a while back.

Roy

 

[nippynoo]

Thanks everyone, thats very useful and I'll have a look at those links..