Can I place anchors in an Image

[Mickbw]

Hi,

I have a large map that I plan to link to.

Is it possible to place several anchors in the image to link to the correct location in the image?

Michael Brennan-White
New Hampshire Treasury Department

http://www.nh.gov/treasury

 

[BillyRayPreachersSon]

Yes - you'll have to use an image-map. Suggest reading up on the map, area, shape, and coord tags/attributes.

Hope this helps,
Dan

 

[Mickbw]

Thanks for your reply,

I have an image map associated with the image which I am using so that when someone clicks on a hotspot in the image they will go to the href page.

What I want to also do is link from another page to a specific location in the image similar to the <a> tag.



Michael Brennan-White
New Hampshire Treasury Department

http://www.nh.gov/treasury

 

[BillyRayPreachersSon]

How would you link to a specific point in an image?

Surely you want to link to the link that the specific point in the image links to?

Dan

 

[Mickbw]

I was hoping to do a link from the information page to the anchor like this

<a href='map.htm?Location=Sunapee'> with the anchor being part of the image.



Michael Brennan-White
New Hampshire Treasury Department

http://www.nh.gov/treasury

 

[BillyRayPreachersSon]

I guess one of us has misunderstood the other ;o)

You say that your map image has an image map associated with it, so that when a user clicks on a region of the image, an url specified by an href is loaded.

You then say that you want to link to the anchor links that are part of the image - by this, I'm assuming you mean the links in the image map that already exist.

If that is the case, instead of calling map.htm with a parameter, why not just directly load the page that would have been loaded when the image map was clicked anyway?

Dan

 

[Mickbw]

I'm sorry. I'm not trying to be deliberately vague.

I have a map at

http://www.carbodehydrated.com/Parks/Maps/GreatNorth.cfm

On the page I have included the following code for the image map.

<img src="../Images/GreatNorth.jpg" width="745" height="1061" border="0" usemap="#Map" />
<map name="Map" id="Map">
  <area shape="rect" coords="384,246,467,292" href="[URL unfurl="true"]http://www.nhstateparks.org/ParksPages/LakeFrancis/LakeFrancis.html"[/URL] border="2" />
</map>

Obviously by clicking on the Lake Francis State Park you will be brought to the information page for the State Park.
[COLOR=red yellow]This works fine[/color]

From another page which would contain a list of all the state parks, I would like to make a link to the page with the map. If the Lake Francis State Park was the link that was clicked, I would like it to be centered in the map when it is displayed.

Is this possible? I do have the capability to edit the image with Paint Shop Pro or Fireworks if that will help me do it.

Thanks,



Michael Brennan-White
New Hampshire Treasury Department

http://www.nh.gov/treasury

 

[BillyRayPreachersSon]

To centre the region, you would need to use Javascript, as, unlike A tags, you cannot assign a NAME attribute to AREA tags, so they're not easy to focus/centre/jump to.

Hope this helps,
Dan

 

[BabyJeffy]

As Dan says... there are no NAME attributes you can use in images. But here is a possible suggestion that you could dissect...

On the second page (where you have a list of the parks) extend the URLs to include the X,Y co-ordinate (relative to the top left of the image - which is sitting on an HTML page) for the park. This might look like:

<a href="mapping.php?mapnum=34&x=123&y=45">Yellowstone</a>

The mapping.php file picks out the map image to display on the page, picks out the X and the Y co-ordinates.

You could use the X and Y co-ordinates to position a DIV (with a big "You are HERE" arror, say) over the image (that was specified by the mapnum parameter). You could also set the onLoad for the window to use scrollTo() to scroll the X and Y location into view (if it is off-screen).

It doesn't provide a perfect implementation (as neatly as NAME does) - but it sounds like it will give much the same result.

Jeff