Javascript with SVG not working in IE

JavaScript
1

Hello,

I’m trying to add some basic interaction to a SVG map of Africa, using Javascript. All I want is that when you rollover a country, the name appears and the country is highlighted - something simple.

I’m new to SVG so I first read both part 1 and [URL=“http://www.alistapart.com/articles/using-svg-for-flexible-scalable-and-fun-backgrounds-part-ii/”]part 2 of the A List Apart articles about SVG.

As you might know, there are many ways to use and embed SVG, but the best option for me seemed to be SVG Web, because it works on all browsers and allows scripting.

In my HTML file I’ve put the SVG within a <script> tag as they recommend.

I’ve tried really simple jQuery interactions such as prompting an alert box when clicking on a country, but it does not work in IE. I’ve tried with normal javascript too but it doesn’t work. I’m trying to apply a behaviour to the <path> element of the SVG.

It works fine in all intelligent browsers but not in IE6-7-8

Any ideas?

thanks

2

No but as the A list apart article explains, it’s possible to support IE by using a library such as SVGWeb, Ample SDK, and Raphael.

SVGWeb seemed easy enough to use so I went for it. My SVG map is displaying just fine on IE6,7 and 8, but the javascript interactions I add will only work on clever browsers. It is specified that SVGWeb enables scripting on all browsers so I don’t know what I’m doing wrong.

3

To the best of my knowledge Internet Explorer doesn’t recongise SVG format files at all.