Skip to main content

Search and Top Navigation

#8351 closed bug (fixed)

Opened May 25, 2012 10:43AM UTC

Closed October 15, 2012 06:33PM UTC

Dialog problem on Firefox when creating dynamic element

Reported by: mariuspuiu Owned by: mariuspuiu
Priority: minor Milestone: 1.10.0
Component: ui.dialog Version: 1.8.20
Keywords: Cc:
Blocked by: Blocking:


I use jQuery 1.7.2 and jQuery UI 1.8.20 with the default ui-lightness CSS. If I am creating a div with an id, title and content, the dialog() works just fine in all browsers, as expected.

But here is the problem: when I am creating that div dynamically and appending it to <body> (or any other existing element on the page), it works fine in all browsers except Firefox. The div is being created, the dialog appears, but the <body> element "minimizes".

I can see that by inspecting the <body> element with Firebug or by using "modal: true" as a parameter for dialog() function. It behaves like the height of the <body> element has been reduced to a minimal value. More weird than this is that if I drag the dialog, it throws itself in that tiny "space".

The code is here: (all I am doing is to create that div element dynamically and call dialog() on it) and here are two screenshots of the behaviour: Chrome, Opera, IE works, Firefox doesn't (you can also see the "minimized" <body> element in Firebug).

Here you can see what's happening on IE, Chrome, Opera (OK): and here is for Firefox (not OK):

Thank you!

Attachments (0)
Change History (4)

Changed May 25, 2012 12:00PM UTC by scottgonzalez comment:1

owner: → mariuspuiu
status: newpending

I'm not seeing any problems:,html

Changed May 26, 2012 05:18PM UTC by mariuspuiu comment:2

status: pendingnew

It seems that it needs a CSS hack (only on Firefox) on <body> element: body { height: 100%; }

Changed October 11, 2012 02:47PM UTC by scottgonzalez comment:3


Changed October 15, 2012 06:33PM UTC by drewkimrey comment:4

resolution: → fixed
status: newclosed

This is fixed in 1.9.0 you can see this in the video below:

updated jsbin: