I am working on a webpage that has some strange issues.
I am working on making the page compatible with IE8 and earlier, and so far it has been quite a nightmare.
The page is heavily reliant on an SVG based UI, so to compensate for this in IE I have created implemented SVGweb, which renders the SVG as flash.
The page loads as it should in IE8, about 60% of the time. The different provinces/regions on the map show up, in colour, and all of the cities (circle) elements load as they should.
The other 30% of the time, the cities load, but are black (the JS function that sets the city's fill colour attributes is either never called, or fails), and the provinces do not load correctly.
When the page does not load, you can refresh it, and then it will generally work as it is meant to. I do not understand why a page which executes the same code everytime it's loaded would only work some of the time.
I have tried using the IE debugger (F12) and haven't really gotten anywhere. When the page does not load correctly, IE gives no information about any errors related to this page.
I think I've narrowed this down to the fact that the refresh method gets called before the page markup has loaded, although because this SVG is being rendered as flash I dont know how to go about testing to see if it has been loaded.
I've been using $(document).ready() but it doesn't seem to help.
I tried the window.onload and it still was giving me problems. I guess the SVG was taking too long to render as flash. I ended up fixing this by reading through the SVGWeb documentation and I came up with this: