CODEWITHSUNDEEP
imagedictionaryinternet-explorer-10
Elysia -
Elysia -

Reputation: 1

image map dead in internet explorer 10

I need help with an image map! It seems they are not compatible with IE10. Although I have one on another site have made that works. But does anyone have any idea why this is not working? It was working then all the sudden after an update...stopped. Does anyone have any ideas?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
</head>

<body>
       <img alt="" src="http:///www.elysiawright.com/asset/mapjennifer.png" width="665" height="413" usemap="#Map" style="border-width: 0px;border-style: solid;" />
    <map name="Map" id="Map">
    <area shape="poly" coords="516,147,522,142,524,145,575,137,581,143,579,153,585,161,577,167,575,171,520,183,515,147" href="http://www.allnaturalbeelievers.com/Pennsylvania.html" />
    <area shape="poly" coords="502,208,505,196,508,201,513,185,520,181,520,169,522,183,535,180,536,188,544,181,552,178,556,185,549,185,544,198,540,200,535,200,531,213,527,219,513,224,501,209" href="http://www.allnaturalbeelievers.com/WestVirginia.html" />
    <area shape="poly" coords="468,159,474,199,475,199,491,204,501,204,520,182,516,148,501,159,484,156,466,159" href="http://www.allnaturalbeelievers.com/Ohio_2.html" />
    <area shape="rect" coords="388,4,608,67" href="http://www.allnaturalbeelievers.com/distributorsignup.html" />
    <area shape="poly" coords="555,402,564,389,565,378,565,373,534,318,459,325,457,331,476,331,485,341,497,334,516,342,524,366,557,403" href="http://www.allnaturalbeelievers.com/Florida.html" />
    <area shape="poly" coords="472,199" href="#" />
    <area shape="poly" coords="435,222,459,217,471,203,466,157,436,162,433,220" href="http://www.allnaturalbeelievers.com/Indiana.html" />
    <area shape="poly" coords="496,230,582,220,576,210,573,201,564,189,560,186,557,184,549,184,548,198,538,200,530,218,513,226,506,223,495,228" href="http://www.allnaturalbeelievers.com/Virginia.html" target="#" />
    </map>
</body>
</html>

Upvotes: 0

Views: 1158

Answers (1)

Tim M.
Tim M.

Reputation: 54377

Remove the third slash in the image URL and it works fine for me in IE10.

Demo: http://jsfiddle.net/xeG7d/1/

BAD

<img alt="" src="http:///www.elysiawright.com/asset/mapjennifer.png" width="665" height="413" usemap="#Map" style="border-width: 0px;border-style: solid;" />

GOOD

<img alt="" src="http://www.elysiawright.com/asset/mapjennifer.png" width="665" height="413" usemap="#Map" style="border-width: 0px;border-style: solid;" />

The W3 Validator catches this error, and is a valuable debugging tool for situations like this. However, I'll admit that despite the error I didn't catch the malformed URL right away.

Upvotes: 1

Related Questions