Popup box when I click on an imagemap within an image?

Question

Hi,Now that Muse has long been discontinued...I have a large image on a website that has several smaller (numbered dots) images on it. I want to have an image map that will open up a small window that I can add text or links to whenever I click or hover over the smaller (numbered dot) image. Like where a user could hover over a number to get more info?Is this possible? I know that an image map can open a new webpage, but can it do a hoverbox or imagebox as well?Thanks!

Nancy OShea · Accepted Answer

What you want are called tooltips.The simplest way to make a tooltip is with the TITLE attribute.LINKFor fancier tooltips, see links below.CSS Tooltip Bootstrap Tooltip Bootstrap popovers/#example W3.CSS Tooltips I don't recommend using Image Maps in responsive layouts. The hotspot coordinates invariably fall out of register when image is re-scaled. A safer approach is to use separate images, buttons or text links.

Slang755489123 · Answer

OK, so I am one step closer (thanks to everyone for their input) but what I did was add a hotspot to the selected area on my main image, then added a behavior- add an open browser window.

Now here are some more questions I need help with...

1. I need the window that the image map is linked to via behaviors to be a modal window (say 500px500p) that is a spot for text, an attached PDF and a contact form. Can this be done? Is it best to make the popup window a form and modify form that to hold a PDF and contact us info? Then link to that form from the hotspot-behavior?

2 I have 30 hotspots to do this on, thus 30 separate popup windows (each with a PDF) is there a better way to call the information into the window or should I just create 30 forms, and each form is named 1,2 3 etc and have each PDF attached to them?

Does this make sense?

What I am ultimately trying to achieve is have my main image with 30 hotspots that each open up a modal window that has text, a PDF attached and a contact form...for each hotspot(30) on my main image.

Anyone?

Popup box when I click on an imagemap within an image?

<a href="https://example.com" title="This is a link to example.com">LINK</a>

23 replies

<a href="https://example.com" title="This is a link to example.com">LINK</a>

<a href="https://example.com" title="This is a link to example.com">LINK</a>

<a href="https://example.com" title="This is a link to example.com">LINK</a>

Sign up

To post, reply, or follow discussions, please sign in with your Adobe ID.

Sign in to Adobe Community

To post, reply, or follow discussions, please sign in with your Adobe ID.