Personal I'm trying to create in a picture of a product several points of interest, when the person clicks on one of these points will open a tooltip with the necessary information.
I've already created the coordinates using an online tool ( link ) and so far so good, everything working, when I click opens the link or appears the title I've set. Only I want it to stay in the "icon" of (+) in each area of interest and this I do not know how to do.
My code is like this so far:
<img src="imagem-que-estou-usando.jpg" usemap="#image-map">
<map name="image-map">
<area target="_blank" alt="Alt da Imagem" href="http://google.com" coords="629,336,56" shape="circle" title="Title quando hover">
</map>
Is there any way I can insert such customizations in the area? And how do I trigger this with the click to open the tooltip? I was thinking of doing using jQeury, but I'm open to suggestions!
An example of how I wanted this is: link
Thank you!