Opened 8 years ago

Closed 8 years ago

#8351 closed bug (fixed)

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!

Change History (4)

comment:1 Changed 8 years ago by Scott González

Owner: set to mariuspuiu
Status: newpending

comment:2 Changed 8 years ago by mariuspuiu

Status: pendingnew

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

comment:3 Changed 8 years ago by Scott González


comment:4 Changed 8 years ago by drewkimrey

Resolution: fixed
Status: newclosed

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

updated jsbin:

Note: See TracTickets for help on using tickets.