Killersites Community: Hotspot Link Compatibility Issue with Firefox - Killersites Community

Jump to content

Page 1 of 1
  • You cannot start a new topic
  • You cannot reply to this topic

Hotspot Link Compatibility Issue with Firefox Firefox will not recognize the hotspot (vector) links on my site

#1 User is offline   Luke 

  • Group: New Members
  • Posts: 3
  • Joined: 13-April 12

Posted 13 April 2012 - 05:26 PM

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?
0

#2 User is offline   Eddie 

  • PipPipPipPip
  • Group: Advanced Member
  • Posts: 3,534
  • Joined: 19-December 08
  • LocationTexas

Posted 14 April 2012 - 10:34 AM

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.
1

#3 User is offline   Luke 

  • Group: New Members
  • Posts: 3
  • Joined: 13-April 12

Posted 16 April 2012 - 12:49 PM

View PostEddie, on 14 April 2012 - 08:34 AM, said:

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?
0

#4 User is offline   Wickham 

  • PipPipPipPip
  • View gallery
  • Group: Advanced Member
  • Posts: 1,732
  • Joined: 20-December 08
  • LocationSalisbury UK

Posted 16 April 2012 - 01:54 PM

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"> 

0

#5 User is offline   Luke 

  • Group: New Members
  • Posts: 3
  • Joined: 13-April 12

Posted 18 April 2012 - 10:10 AM

View PostWickham, on 16 April 2012 - 11:54 AM, said:

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!
0

Share this topic:


Page 1 of 1
  • You cannot start a new topic
  • You cannot reply to this topic

1 User(s) are reading this topic
0 members, 1 guests, 0 anonymous users