How to have multiple links from one image in rails

问题

I have one image from which I have to have 7 different links based on the part of the image clicked. How do I go about it using rails?

回答1:

For future reference, you're talking about "image maps" - there's various tutorials for these, eg http://www.onextrapixel.com/2009/04/30/how-to-create-multiple-links-on-a-single-image-with-image-map/

As far as i know this isn't really a rails question, as image maps are a totally front-end thing: like js, they only relate to the page as seen in the browser. As far as rails is concerned, when you click on a link it doesn't care whether that link was on an image map or not.

So, it's just some raw html that you would put in your view template.

I suppose you could make the image maps data-driven though, so that for example you store an image filename in the db and then save any map data in the db too, in an image_maps table. It's only worth doing this if you want to make the image maps user-editable, like flicker does for example. (flickr lets you draw a rectangle on an existing photo and tag it with some text)

回答2:

just use url_for to generate the needed url

<img usemap="image_link" src="..." alt="" width="235" height="32" style="display: block;" />
<map name="image_link">
    <area href="<%= url_for root_path %>" alt="Home" coords="0,0,189,19" shape="rect" />
    <area href="<%= url_for :controller => "post", :action => "all" %>" alt="All posts" coords="190,0,386,22" shape="rect" />
    <area href="<%= url_for new_resource1_path %>" alt="New resource1" coords="387,0,657,23" shape="rect" />
</map>

the root_path is defined as the home page and resource1 as a resource in config/routes.rb.

回答3:

This is more of a javascript/flash type thing. You can absolutely position divs with links if you know exactly where the links need to go and you are not looking for an area for the user to click because this will just generate a link with text in a specific position.

Sounds to mee like you will need to make a flash app or do javascript workaround. This is not a Rails type issue so your solution won't come from Ruby/Rails.

来源：https://stackoverflow.com/questions/4617106/how-to-have-multiple-links-from-one-image-in-rails