ansaurus

Question

Trying to resize a jQuery dialog in IE6?

Answer 1

A:

The css may be a factor. Could you change your example so we can see your stylesheet? I've updated the example so that it doesn't depend on having jQuery locally.

<html>
<head>
<title>Example of IE6 resize issue</title>
<link rel="stylesheet" type="text/css" href="?.css" />
<script src="http://www.google.com/jsapi"&gt;&lt;/script&gt;
<script>
 google.load("jquery", "1");
 google.load("jqueryui", "1");

 google.setOnLoadCallback(
 function() {
  $(document).ready(function()
        {
            $("#main-dialog").dialog();
     });
    });
</script>
</head>
<body>
<div id="main-dialog">
    This is just some simple content that will fill the dialog. This example is
    sufficient to reproduce the problem in IE6. It does not seem to occur in IE7
    or FF. I haven't tried with Opera or Safari.
</div>
</body> 
</html>

Dave Richardson 2008-09-23 09:31:54

Answer 2

+2 A:

I was able to come up with a solution. If you add the style overflow: hidden to the dialog container div element (which has the css class .ui-dialog-container applied to it), then everything resizes correctly. All I did was add a css rule as follows to the flora theme:

.ui-dialog .ui-dialog-container {
  overflow: hidden;
}

It could also be corrected by executing the following:

if ($.browser.msie && $.browser.version == 6)
{
  $(".ui-dialog-container").css({ overflow: 'hidden' });
}

This corrected the issue I was seeing under IE6 and has not introduced any problems in FireFox.

Harry Steinhilber 2008-09-24 21:29:39

Is this a general hasLayout issue? Could adding position:relative or zoom:1 do the same thing?

Steve Paulo 2008-09-24 23:00:10

I tried both position:relative and zoom:1, neither corrected the issue like overflow:hidden did.

Harry Steinhilber 2008-09-26 20:35:33

ansaurus

tags:

views:

answers:

Trying to resize a jQuery dialog in IE6?

related questions