JQuery UI dialog box: huge div on IE 8 background

I am trying to use the jQuery UI modal dialog and test my stuff in IE8. Each time a dialog box appears, a huge DIV is created in the background, and IE continues to resize the thumb of the vertical scroll bar, and if there was a huge page load in the background. In compatibility mode, IE changes the vertical scrollbar once, everything works as expected, and it does not look like the page is still loading. The jQuery UI sample works just fine for me.

Here is my code:

$("#confirm_stage_change").dialog({
    autoOpen: false,
    bgiframe: true,
    modal: true,
    height: 300,
    width: 300,
    draggable: false,
    resizable: false
});

This is my "dialogue":

<div id="confirm_stage_change" title="Confirm Stage Change">
    <p>
        Hello!!!
    </p>
</div>

Here's the div I see in the inspector:

<div class="ui-widget-overlay" style="z-index: 1001; width: 1069px; height: 20218px;" jQuery1257312441701="35">

Has anyone seen something like this?

Thanks!

UPDATE: IE8 (XHTML 1.0 Strict: jQuery ), IE Quirks .

+5
3

: JQuery UI 100%

.

.ui-widget-overlay 
{ 
    position: fixed; 
}
+8

, , :

jQuery UI Dialog widget ( ) . . , quirks, quirks jQueryUI. , , div, .

, - . , , , - .

0

, -, doctype - :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
0

All Articles