RSS
 

IE8 Crash – Inline-Block Scroll with DOM Append

02 Mar

Was struggling for many hours today to figure out what has turned out to be a really stupid bug in IE8. In the hopes I can prevent even a single person from wasting their day like I have trying to figure out what is wrong with my code, I’ll explain below how the bug presents itself with examples.

I’m not 100% certain of every variable required to cause the bug, but it definitely works in this example:
IE8 crash

The general structure of the page is:

<body>
<div id="outer" style="display:inline-block;overflow:auto;height:100px;">
  ... any multi-line content that forces the div to have a scrollbar ...
</div>
</body>
<script>
$("#outer").scroll(function(){
  $("<div></div>").appendTo("body");
});
</script>

In that example <body> has only the one direct child element and if you scroll it causing the appendTo() function to be called, IE8 crashes. (I’ve only tested this on Windows 7 machines. IE7 does not crash.)

This is the same example, but it works. The only difference is that a second <div> child was included within <body> but with that one change, the bug vanishes. Note that I’ve also tested this with multiple scrolling divs in body and the bug persists. It seems there must be at least one block element in <body> to prevent the bug.

Fortunately, it’s not often that one would create a page with just scrollable divs in the body.

 
1 Comment

Posted in Bugs

 

11,159 views

Tags: , , , , , ,

Leave a Reply

 

 
  1. rembi

    October 16, 2011 at 10:47 pm

    Good Findings
    IE8 crash on embed style overflow:auto
    either overflow-x or overflow-y scroll work but both will crash
    class style will not crash but only overflow-y applied
    In short , IE suck & M$ fuck