Photoshop Question posted in
The official user guide can be found here.

Cutting up one image and giving each part a link – Photoshop

I have an image in Photoshop that i would like to turn into a navigation graph. I need the individual pieces to be buttons but i do not want to cut out every single piece and re position it in html and css. Is there a way to take an image and designate a part of it to a certain link then do the same to the others without taking the image apart? I have adobe Photoshop cs6 so i do have flexibility in terms of editing.

Thanks so much for any help i have been stuck with this problem for days.

Here is a link to the image: http://picpaste.com/TheBestThingEver-DcyjrkW8.jpg

Tags:

2

Answers


  1. 0

    The map and area tags in html will let you accomplish this. An example is at this link http://www.htmlcodetutorial.com/images/images_famsupp_220.html

    Login or Signup to reply.
  2. 0

    You can use an image map.

    Concept: http://www.w3schools.com/tags/tag_area.asp

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

<map name="planetmap"> <!-- this name must match the 'usemap' name above -->
  <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>

    HowTo: http://www.graphics.com/article-old/creating-web-page-mockups-and-image-maps-photoshop

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search