IE javascript bug is kicking my ass
June 19, 2008 4:06 PM   Subscribe

Javascript/CSS and IE6/7: content called from a javascript file (a modified form of fontSizer) into an otherwise blank div appears and disappears intermittently in IE6/7. Help a newbie!

I know enough Javascript to just squeak by, but this bug is bugging the hell out of me. The content written from a .js file (images and text) appears every time in Firefox but only sometimes in IE6/7. Sometimes a page reload will reveal it, sometimes returning to the page from another page on the site will reveal it.

My first guess was the peekaboo bug, but none of the fixes work and if I disable the pages' css the content still appears/disappears the same way.

The pages in question are still in development (i.e. not live), so MeFi Mail me for a URL.

Any ideas or suggestions on how to debug this are gratefully welcomed!
posted by Paragon to Computers & Internet (6 answers total)
Best answer: I've seen this happen, but never did sort it out to my satisfaction. IIRC, it's due to an IE6 (& presumably 7) interaction between DOM events and body events.

Have you got multiple addDOMLoadEvent calls (i.e. calling the same or different functions several times for different DOM objects)? Does it work when you call the function from a <body onLoad="..."> event?

(I'm off to uni - yay, exams! - so someone else will have to help further.)
posted by Pinback at 5:48 PM on June 19, 2008

Response by poster: There was an addDOMLoadEvent call for that function in the .js file, so I moved it to a body onLoad and it worked nicely! It did, however, shut off another function - which was using an addEvent(window, 'load') call - so I moved that into the body onLoad as well.

Short term solution, thank you Pinback! Long term solution, do I need to put every onLoad event into the body tag directly, and call none of them via other means? I don't really want to play what-event-has-been-shut-down tag with IE. Does this bug have a name - is there a summary somewhere online for it?
posted by Paragon at 6:39 PM on June 19, 2008

I haven't run into this particular problem, but I know IE treats elements added by DOM differently than elements with other sources, and to overcome some bugs you can force it to re-evaluate a section of the document by touching it with the "HTML-mode" methods.

So, if adding some_dom_el is causing problems, try, after appending everything with DOM,

some_dom_el.parentNode.innnerHTML += '';

It seems completely stupid, but I've seen this miraculously fix a bunch of IE6 quirks.
posted by moift at 10:31 PM on June 19, 2008

Oops, I meant innerHTML there.
posted by moift at 10:32 PM on June 19, 2008

Well, like I said when I encountered it I never did sort it out to my satisfaction...

Without knowing all the details of the different events your trying to trap, the event handler functions you're calling, and at what point they're being called, I can't really add any more except to say that your other addEvent(window, 'load') is exactly the same as <body onLoad(...)> when you're not using frames - but it seems the body version takes precedence & can't be replaced/stacked if it exists.

It was 6~7 years ago, about the time IE6 was released, that I encountered this - which also BTW pretty much predates people giving names to DOM & CSS bugs/workarounds - so sorry, no, I don't remember any links to summaries, explanations, or workarounds. IE compatability was/is very much a distant second concern for me so I tend to just give up, make sure it works in FF, and exclude any DOM manipulation fanciness from IE altogether.
posted by Pinback at 5:10 PM on June 20, 2008

Response by poster: Thanks very much for your help, guys. I guess I was plugging too much external code in without seeing whether they would conflict with each other somehow.

Also, I hope your exam went well!
posted by Paragon at 7:22 PM on June 20, 2008

« Older I don't have time to type "" every...   |   Need to strengthen back muscles Newer »
This thread is closed to new comments.