1

I've used HTML map and area tags to create a rectangle hotspot in an image. Now I'm trying to see where is the hotspot on the image when the page loads. How can I make a hotspot area visible in HTML? Does it require using CSS or JQuery, or what is the correct approach?

<div id="container1" class="container" style="background: #CFCFCF">
  <img id="1" usemap = "mymap" src="http://www.goodhousekeeping.com/cm/goodhousekeeping/images/ue/ghk-dogs-Australian-Shepherd-mdn.jpg" />
</div>

<div id="container2" class="container" style="float:right;background: #FFFFFF">
  <img id="2"  usemap = "mymap" src="http://www.goodhousekeeping.com/cm/goodhousekeeping/images/ue/ghk-dogs-Australian-Shepherd-mdn.jpg" />
</div>

<div id="container3"  class="container" style="background: #CFCFCF">
  <img id="3" usemap = "mymap" src="http://www.goodhousekeeping.com/cm/goodhousekeeping/images/ue/ghk-dogs-Australian-Shepherd-mdn.jpg" />
</div>  

<map name="mymap" id="mymap" "> 
  <area id="m1"  shape="rect" coords="87,355,130,392"  href="http://www.google.com" target="_blank" />              
</map>
Omar
  • 32,302
  • 9
  • 69
  • 112
user3114999
  • 25
  • 5
  • Please, OP, add a small snippet to your post, showing how you've implemented the hotspot, and what you've tried so far to change the visibility. – Rubens Dec 18 '13 at 11:35
  • 1
    @Rubens comments should not be added to question. – Omar Dec 18 '13 at 12:27
  • @Omar Ah, thanks for pointing it! I'll just leave them where they belong next time. – Rubens Dec 18 '13 at 12:57

1 Answers1

0

Forgive me if I'm stating the obvious, but assuming you'd always want it to be visible, why not just edit the actual image?

Alternativley, there's a suggestion here that might help: Visible Area tag?

Community
  • 1
  • 1
Sinister Beard
  • 3,570
  • 12
  • 59
  • 95