IE 8 Frameset / Javascript error

Question

Ok here's the problem. I have a page that works in FF3 and Safari4 no problem. It's IE8 that's causing the issue, go figure. I remember in the Netscape days when it was the opposite.

Anyways,

So i'm building a website for a friend - i have three pages. the first two work fine on their own, but when they are combined in a frameset in the third (main.html) in IE8 all hell breaks loose. here are the pages:

www.wither.org/Karoline/navigation.html

www.wither.org/Karoline/portfolio.html

http://www.wither.org/Karoline/main.html

& my CSS if you want it: www.wither.org/Karoline/css/styles.css

if anyone can figure out how to fix this, i'd be eternally grateful. It's completely baffling to me and i've tried all kinds of options. i upgraded jquery to the latest version but then my scroller didn't work and i can't dive too much into the javascript code right now.

Please if you could help out, it would mean a lot to me. this has to go live sometime tomorrow.

Answer 1

What's the actual javascript error?

And IE does have an issue in regards to invalid/broken markup inside of frames, I would try

a) commenting out each script and see which causes the js error b) if commenting out all the js did nothing it might be related to the invalid markup inside of a frame issue, in which case I'd ditch frames alltogether.

Answer 2

There is a JS error when executing the following line of code

document.getElementById("loading").style.display = 'none';

in the portfolio page.

Apparently, the element with id 'loading' is not being found. However, if I continue execution of the JavaScript on the page (from within the debugger), there are no issues, and the behavior is the same as in Firefox. This is indicative of a concurrency issue - the element 'loading' is not present in the DOM yet, but the script is attempting to change the element's style.

In order to fix this issue, you will have to ensure that the 'loading' element is present in the DOM before its style is being changed. In fact, you could delay the execution of the onload event handler (using window.setTimeout), until a point where the element is present in the DOM.

Answer 3

yeah....

so thanks so much for your help. problem solved and i figured the other CSS error. should have picked up on that one earlier.

so site is working and if you want to see what happened with your help,

http://www.wither.org/Karoline

it works perfectly cross platform. made the deadline with hours to spare. thanks SO much. can't believe how well this worked.