Hotspot Link Compatibility Issue with Firefox

[xoxfxjx]

My company's website (http://www.forbes-av...4/Default.aspx has a Rep Map on this page. Each of the states is supposed to be a clickable hotspot to link to other information. This works just fine in IE but for some reason Firefox doesn't recognize that there are any clickable links there. Anyone have any ideas as to why this might be?

[newseed]

The usemap should match precisely as the 'name' of the map tag.

 

<map name="FPMap0">

 

is not the same as...

 

usemap="#FPMap0"

 

 

Either remove the # from usemap or add the # to the map name.

[xoxfxjx]

The usemap should match precisely as the 'name' of the map tag.

 

<map name="FPMap0">

 

is not the same as...

 

usemap="#FPMap0"

 

 

Either remove the # from usemap or add the # to the map name.

 

 

I tried this and it doesn't seem to change anything in Firefox. When I took the # out of the usemap name, it stopped working in IE. Any other ideas?

[Wickham]

It's not the "#FPMap0" or "FPMap0" which are correct: name="FPMap0" and usemap="#FPMap0". Firefox doesn't like the "a" tag inside the map element. You have:-

<map name="FPMap0">

<a href="/Portals/0/ForbesMap/audio-Forbes-AV-
International.htm#LiveContent[ForbesMap]" 
target="_blank" alt="Forbes-AV, Tony Janesin">

<area class="pointer" 
href="/Portals/0/ForbesMap/audio-Forbes-AV-
International.htm" shape="POLY" alt="Forbes-AV, Tony 
Janesin" target="_blank" 
coords="211,148,196,120,202,112,196,94,186,100,182,75,1
90,75,204,75,205,57,198,31,194,22,183,18,182,7,195,9,19
9,14,278,46,330,53,405,51,453,44,458,44,456,54,465,57,4
71,79,478,74,505,80,518,90,533,96,556,95,557,108,561,12
2,577,136,586,136,577,110,573,104,584,95,589,76,581,59,
573,56,568,48,571,38,568,28,563,23,566,16,560,12,563,3,
572,3,579,3,586,0,602,8,609,11,612,5,617,8,618,24,625,3
1,637,35,643,20,641,12,641,4,647,11,653,19,659,22,659,3
4,667,35,675,54,679,66,658,70,662,76,657,84,666,92,675,
99,687,99,682,84,689,80,693,92,733,69,737,73,738,82,727
,104,710,110,723,120,701,124,707,138,688,152,681,155,67
9,162,671,166,669,180,668,191,659,196,644,203,624,214,6
22,219,609,224,602,232,599,239,585,242,573,251,568,250,
576,239,582,230,579,223,582,218,579,212,561,204,548,197
,544,186,532,182,524,173,513,174,503,185,485,186,477,18
1,468,182,458,176,400,174,379,174,320,166,278,158,228,1
46,226,155" />
</a>
 <!--and the others-->

</map></p> 
<div align="center">
<img border="0" alt="" src="images/A-V-repmap-03.01.12
-for-website.jpg" width="740" height="468" 
usemap="#FPMap0" /></div>

but I can get Firefox to operate links if the "a" tags are removed:-

<map name="FPMap0">
<!--<a href="/Portals/0/ForbesMap/audio-Forbes-AV-
International.htm#LiveContent[ForbesMap]" 
target="_blank" alt="Forbes-AV, Tony Janesin">-->

<area class="pointer" 
href="/Portals/0/ForbesMap/audio-Forbes-AV-
International.htm" shape="POLY" alt="Forbes-AV, Tony 
Janesin" target="_blank" 
coords="211,148,196,120,202,112,196,94,186,100,182,75,1
90,75,204,75,205,57,198,31,194,22,183,18,182,7,195,9,19
9,14,278,46,330,53,405,51,453,44,458,44,456,54,465,57,4
71,79,478,74,505,80,518,90,533,96,556,95,557,108,561,12
2,577,136,586,136,577,110,573,104,584,95,589,76,581,59,
573,56,568,48,571,38,568,28,563,23,566,16,560,12,563,3,
572,3,579,3,586,0,602,8,609,11,612,5,617,8,618,24,625,3
1,637,35,643,20,641,12,641,4,647,11,653,19,659,22,659,3
4,667,35,675,54,679,66,658,70,662,76,657,84,666,92,675,
99,687,99,682,84,689,80,693,92,733,69,737,73,738,82,727
,104,710,110,723,120,701,124,707,138,688,152,681,155,67
9,162,671,166,669,180,668,191,659,196,644,203,624,214,6
22,219,609,224,602,232,599,239,585,242,573,251,568,250,
576,239,582,230,579,223,582,218,579,212,561,204,548,197
,544,186,532,182,524,173,513,174,503,185,485,186,477,18
1,468,182,458,176,400,174,379,174,320,166,278,158,228,1
46,226,155" />
<!--</a>-->
 <!--and the others-->

</map></p> 
<div align="center">
<img border="0" alt="" src="images/A-V-repmap-03.01.12
-for-website.jpg" width="740" height="468" 
usemap="#FPMap0" /></div>

but I don't know what that will do to the way you want the map to work. It isn't usual to have an "a" tag there. It should be in the format:-

<map name="my-map">
<area shape="rect" href="introduction.php" coords="10,1,75,30" alt="Introduction">
<area shape="rect" href="generaladvice.php" coords="95,20,170,50" alt="General Advice">
</map>
<img usemap="#my-map" src="images/map-image.jpg" alt="Map"> 

[xoxfxjx]

It's not the "#FPMap0" or "FPMap0" which are correct: name="FPMap0" and usemap="#FPMap0". Firefox doesn't like the "a" tag inside the map element. You have:-

<map name="FPMap0">

<a href="/Portals/0/ForbesMap/audio-Forbes-AV-
International.htm#LiveContent[ForbesMap]" 
target="_blank" alt="Forbes-AV, Tony Janesin">

<area class="pointer" 
href="/Portals/0/ForbesMap/audio-Forbes-AV-
International.htm" shape="POLY" alt="Forbes-AV, Tony 
Janesin" target="_blank" 
coords="211,148,196,120,202,112,196,94,186,100,182,75,1
90,75,204,75,205,57,198,31,194,22,183,18,182,7,195,9,19
9,14,278,46,330,53,405,51,453,44,458,44,456,54,465,57,4
71,79,478,74,505,80,518,90,533,96,556,95,557,108,561,12
2,577,136,586,136,577,110,573,104,584,95,589,76,581,59,
573,56,568,48,571,38,568,28,563,23,566,16,560,12,563,3,
572,3,579,3,586,0,602,8,609,11,612,5,617,8,618,24,625,3
1,637,35,643,20,641,12,641,4,647,11,653,19,659,22,659,3
4,667,35,675,54,679,66,658,70,662,76,657,84,666,92,675,
99,687,99,682,84,689,80,693,92,733,69,737,73,738,82,727
,104,710,110,723,120,701,124,707,138,688,152,681,155,67
9,162,671,166,669,180,668,191,659,196,644,203,624,214,6
22,219,609,224,602,232,599,239,585,242,573,251,568,250,
576,239,582,230,579,223,582,218,579,212,561,204,548,197
,544,186,532,182,524,173,513,174,503,185,485,186,477,18
1,468,182,458,176,400,174,379,174,320,166,278,158,228,1
46,226,155" />
</a>
 <!--and the others-->

</map></p> 
<div align="center">
<img border="0" alt="" src="images/A-V-repmap-03.01.12
-for-website.jpg" width="740" height="468" 
usemap="#FPMap0" /></div>

but I can get Firefox to operate links if the "a" tags are removed:-

<map name="FPMap0">
<!--<a href="/Portals/0/ForbesMap/audio-Forbes-AV-
International.htm#LiveContent[ForbesMap]" 
target="_blank" alt="Forbes-AV, Tony Janesin">-->

<area class="pointer" 
href="/Portals/0/ForbesMap/audio-Forbes-AV-
International.htm" shape="POLY" alt="Forbes-AV, Tony 
Janesin" target="_blank" 
coords="211,148,196,120,202,112,196,94,186,100,182,75,1
90,75,204,75,205,57,198,31,194,22,183,18,182,7,195,9,19
9,14,278,46,330,53,405,51,453,44,458,44,456,54,465,57,4
71,79,478,74,505,80,518,90,533,96,556,95,557,108,561,12
2,577,136,586,136,577,110,573,104,584,95,589,76,581,59,
573,56,568,48,571,38,568,28,563,23,566,16,560,12,563,3,
572,3,579,3,586,0,602,8,609,11,612,5,617,8,618,24,625,3
1,637,35,643,20,641,12,641,4,647,11,653,19,659,22,659,3
4,667,35,675,54,679,66,658,70,662,76,657,84,666,92,675,
99,687,99,682,84,689,80,693,92,733,69,737,73,738,82,727
,104,710,110,723,120,701,124,707,138,688,152,681,155,67
9,162,671,166,669,180,668,191,659,196,644,203,624,214,6
22,219,609,224,602,232,599,239,585,242,573,251,568,250,
576,239,582,230,579,223,582,218,579,212,561,204,548,197
,544,186,532,182,524,173,513,174,503,185,485,186,477,18
1,468,182,458,176,400,174,379,174,320,166,278,158,228,1
46,226,155" />
<!--</a>-->
 <!--and the others-->

</map></p> 
<div align="center">
<img border="0" alt="" src="images/A-V-repmap-03.01.12
-for-website.jpg" width="740" height="468" 
usemap="#FPMap0" /></div>

but I don't know what that will do to the way you want the map to work. It isn't usual to have an "a" tag there. It should be in the format:-

<map name="my-map">
<area shape="rect" href="introduction.php" coords="10,1,75,30" alt="Introduction">
<area shape="rect" href="generaladvice.php" coords="95,20,170,50" alt="General Advice">
</map>
<img usemap="#my-map" src="images/map-image.jpg" alt="Map"> 

 

 

That worked! Thanks for all your help, you're awesome!