Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 660
  • Last Modified:

I can't get "HTML image map" to work on my page

Hi,
I have a page with a map and I want to have the areas clickable.
I made the image map details in dreamweaver and copied the HTML into my page.
but it doesn't seem to work?

<img src="file:///C|/Users/Steven H/Desktop/Temp/newmap.png" alt="South Africa Map" width="975" height="758" border="0" usemap="#Map" longdesc="Map South Africa Provinces" />
<map name="Map" id="Map">
  <area shape="poly" coords="647,240,654,280,673,278,690,290,710,268,721,267,722,260,706,244,728,237,735,216,720,220,712,200,715,191,689,202,674,203,675,226,663,235,655,227" href="#" target="http://www.essential1doctor.co.za/gauteng.html" alt="Gauteng" />
  <area shape="poly" coords="732,390,768,364,772,326,746,305,690,293,650,286,613,294,587,307,590,319,562,339,553,333,504,360,497,392,467,450,494,465,532,504,573,493,612,508,642,490,624,449,662,404,708,390" href="#" target="http://www.essential1doctor.co.za/free-state.html" alt="Free State" />
  <area shape="poly" coords="371,250,382,265,407,238,403,268,422,274,421,283,444,288,443,311,455,317,455,337,470,336,481,357,491,332,503,336,498,347,505,359,554,330,565,335,584,317,583,303,611,289,640,286,653,282,644,240,650,229,663,228,672,205,690,200,682,195,690,188,650,183,619,168,586,162,553,168,536,221,505,225,448,217,413,200,391,199" href="#" target="http://www.essential1doctor.co.za/north-west.html" alt="North West" />
<area shape="poly" coords="735,24,778,19,806,29,860,32,897,120,853,133,859,154,835,155,819,179,802,173,793,188,792,201,741,205,741,187,729,181,703,189,695,198,690,185,586,160,619,109,693,47,724,39" href="#" target="http://www.essential1doctor.co.za/limpopo.html" alt="Limpopo" />
<area shape="poly" coords="775,319,743,302,695,292,723,270,724,259,714,245,730,240,738,221,733,208,727,215,717,195,728,188,737,188,745,212,792,206,805,177,821,181,839,159,861,158,860,138,896,125,902,232,870,225,837,285,836,286,851,301,868,310" href="#" target="http://www.essential1doctor.co.za/mpumalanga.html" alt="Mpumalanga" />
<area shape="poly" coords="802,530,795,520,755,503,739,503,753,485,738,484,738,462,757,428,751,413,728,397,771,367,778,325,867,313,903,314,903,288,956,287,937,373,886,413,851,457" href="#" target="http://www.essential1doctor.co.za/kwa-zulu-natal.html" alt="Kwa-Zulu Natal" />
<area shape="poly" coords="429,694,428,688,413,683,425,676,414,666,376,660,391,633,410,630,404,606,426,600,435,592,443,595,461,582,458,569,474,563,484,550,525,536,538,508,572,497,612,513,646,493,667,499,684,506,691,483,699,479,734,469,735,487,748,487,741,505,795,525,799,533,738,593,671,640,604,679,549,678,542,688,546,699,509,693,498,708" href="#" target="http://www.essential1doctor.co.za/eastern-cape.html" alt="Eastern Cape" />
<area shape="poly" coords="92,526,17,385,37,380,36,366,41,359,55,355,60,365,65,369,71,375,66,379,74,386,88,396,158,403,170,410,179,400,196,387,219,376,218,167,248,194,269,250,254,270,260,284,268,282,318,286,324,275,334,278,347,260,366,251,378,265,406,244,403,272,420,277,439,292,442,312,453,317,453,341,470,340,482,360,492,336,496,336,497,349,501,360,467,453,533,508,526,532,485,548,470,562,454,568,440,567,414,565,399,578,355,560,342,589,315,591,278,617,265,631,238,632,227,611,241,594,227,592,198,610,194,620,194,590,171,572,157,521,163,507,135,492,122,512,100,515" href="#" target="http://www.essential1doctor.co.za/northern-cape.html" alt="Northern Cape" />
<area shape="poly" coords="129,719,119,697,123,684,123,672,116,664,98,640,102,621,113,622,122,593,119,572,92,535,102,519,120,515,136,495,159,510,169,568,192,592,193,623,231,596,236,599,229,616,238,636,267,638,315,594,339,593,357,563,395,581,415,573,455,568,459,579,443,593,410,602,406,630,389,630,377,657,413,669,420,677,414,686,426,693,410,704,346,698,328,714,303,719,274,718,251,725,224,738,204,738,183,724,157,718,150,707,140,701" href="#" target="http://www.essential1doctor.co.za/western-cape.html" alt="Western Cape" />
</map>

Open in new window


the live page is : http://www.essential1doctor.co.za/search.html

Please help me see where it's gone wrong.
0
StevenHook
Asked:
StevenHook
  • 3
  • 2
1 Solution
 
Meir RivkinFull stack Software EngineerCommented:
can u try something, take the target attribute value (the actual url) and place it instead of # in the href attribute.
0
 
StevenHookAuthor Commented:
Thanks.
This seems to work on my PC in a browser now but still not on the web server.

<body>
<img src="Temp/newmap.png" alt="South Africa Map" width="975" height="758" border="0" usemap="#Map" longdesc="Map South Africa Provinces" />
<map name="Map" id="Map">
  <area shape="poly" coords="647,240,654,280,673,278,690,290,710,268,721,267,722,260,706,244,728,237,735,216,720,220,712,200,715,191,689,202,674,203,675,226,663,235,655,227" href="http://www.essential1doctor.co.za/gauteng.html" target="_self" alt="Gauteng" />
  <area shape="poly" coords="732,390,768,364,772,326,746,305,690,293,650,286,613,294,587,307,590,319,562,339,553,333,504,360,497,392,467,450,494,465,532,504,573,493,612,508,642,490,624,449,662,404,708,390" href="http://www.essential1doctor.co.za/free-state.html" target="_self" alt="Free State" />
  <area shape="poly" coords="370,250,381,265,406,238,402,268,421,274,420,283,443,288,442,311,454,317,454,337,469,336,480,357,490,332,502,336,497,347,504,359,553,330,564,335,583,317,582,303,610,289,639,286,652,282,643,240,649,229,662,228,671,205,689,200,681,195,689,188,649,183,618,168,585,162,552,168,535,221,504,225,447,217,412,200,390,199" href="http://www.essential1doctor.co.za/north-west.html" target="_self" alt="North West" />
  <area shape="poly" coords="735,24,778,19,806,29,860,32,897,120,853,133,859,154,835,155,819,179,802,173,793,188,792,201,741,205,741,187,729,181,703,189,695,198,690,185,586,160,619,109,693,47,724,39" href="http://www.essential1doctor.co.za/limpopo.html" target="_self" alt="Limpopo" />
  <area shape="poly" coords="775,319,743,302,695,292,723,270,724,259,714,245,730,240,738,221,733,208,727,215,717,195,728,188,737,188,745,212,792,206,805,177,821,181,839,159,861,158,860,138,896,125,902,232,870,225,837,285,836,286,851,301,868,310" href="http://www.essential1doctor.co.za/mpumalanga.html" target="_self" alt="Mpumalanga" />
  <area shape="poly" coords="802,530,795,520,755,503,739,503,753,485,738,484,738,462,757,428,751,413,728,397,771,367,778,325,867,313,903,314,903,288,956,287,937,373,886,413,851,457" href="http://www.essential1doctor.co.za/kwa-zulu-natal.html" target="_self" alt="Kwa-Zulu Natal" />
  <area shape="poly" coords="429,694,428,688,413,683,425,676,414,666,376,660,391,633,410,630,404,606,426,600,435,592,443,595,461,582,458,569,474,563,484,550,525,536,538,508,572,497,612,513,646,493,667,499,684,506,691,483,699,479,734,469,735,487,748,487,741,505,795,525,799,533,738,593,671,640,604,679,549,678,542,688,546,699,509,693,498,708" href="http://www.essential1doctor.co.za/eastern-cape.html" target="_self" alt="Eastern Cape" />
  <area shape="poly" coords="92,526,17,385,37,380,36,366,41,359,55,355,60,365,65,369,71,375,66,379,74,386,88,396,158,403,170,410,179,400,196,387,219,376,218,167,248,194,269,250,254,270,260,284,268,282,318,286,324,275,334,278,347,260,366,251,378,265,406,244,403,272,420,277,439,292,442,312,453,317,453,341,470,340,482,360,492,336,496,336,497,349,501,360,467,453,533,508,526,532,485,548,470,562,454,568,440,567,414,565,399,578,355,560,342,589,315,591,278,617,265,631,238,632,227,611,241,594,227,592,198,610,194,620,194,590,171,572,157,521,163,507,135,492,122,512,100,515" href="http://www.essential1doctor.co.za/northern-cape.html" target="_self" alt="Northern Cape" />
  <area shape="poly" coords="129,719,119,697,123,684,123,672,116,664,98,640,102,621,113,622,122,593,119,572,92,535,102,519,120,515,136,495,159,510,169,568,192,592,193,623,231,596,236,599,229,616,238,636,267,638,315,594,339,593,357,563,395,581,415,573,455,568,459,579,443,593,410,602,406,630,389,630,377,657,413,669,420,677,414,686,426,693,410,704,346,698,328,714,303,719,274,718,251,725,224,738,204,738,183,724,157,718,150,707,140,701" href="http://www.essential1doctor.co.za/western-cape.html" target="_self" alt="Western Cape" />
</map>
</body>

Open in new window

0
 
TvMptCommented:
You forget the #map

replace

<img width="975" height="758" alt="South Africa Map" src="/images/newmap.png">

with

<img width="975" height="758" alt="South Africa Map" src="/images/newmap.png" usemap="#Map" >
0
What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

 
StevenHookAuthor Commented:
It seems like joomla strips that out?
I do paste it, but when I go view the source after publishing it it's gone
0
 
TvMptCommented:
(i) I believe that you are using Tiny MCE Editor. Open the plugin Editor - TinyMCE for edit in the Plugin Manager (Extensions -> Plugin Manager) and set the parameters as follows:

(a) Functionality to Extended

(b) Code cleanup on save to Never or Front Only


(ii) Also, review the document http://docs.joomla.org/Why_does_some_HTML_get_removed_from_articles_in_version_1.5.8%3F that would be useful.


(iii) You could also set the editor as No Editor in the Global Configurations and edit the article.
0
 
StevenHookAuthor Commented:
Thanks
Worked to use "no editor"
The other's I couldn't find the options as described.
0

Featured Post

Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

  • 3
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now