Skip to main content

Search and Top Navigation

#7982 closed bug (notabug)

Opened January 04, 2012 05:26AM UTC

Closed January 04, 2012 01:05PM UTC

Last modified January 12, 2012 06:07AM UTC

jQuery Dialog inconsistent positioning, and does not repect position arguments

Reported by: shotbolt Owned by:
Priority: minor Milestone: 1.9.0
Component: ui.dialog Version: 1.8.16
Keywords: Cc:
Blocked by: Blocking:

jQueryUI dialogs are positioned using viewport coordinates as arguments,

and if the dialog will not fit completely within the viewport, the

dialog will be moved the the closest position inside the viewport, which is expected behavior.

In this example a dialog is shown with the same (calculated) arguments each time:

that is, viewport coordinates of the right and lower edge of the button.

We would normally expect that the position of the dialog would appear at

the specified position if possible, and that the dialog would not appear in

different locations each subsequent time it is shown.

However the actual behavior depends on the viewport window size and shape

and scroll position, and if the context menu opens near to the edge of the

viewport, it will be shown at the incorrect positioning the first time it

is shown, and at the correct position subsequent times that it is shown.

Bug reduced test case available at jsbin NOTE: Do not use jsbin edit mode as the refresh aspect of the bug may be affected.


Note: To set this bug up, first resize your browser window size or

scroll position so there are about 100px free below the bottom of the button

to the bottom of your browser viewport; then refresh your browser.

see: this example

(Note you must NOT be in jsbin edit mode otherwise the effect of browser refreshing

might be compromised- it is recommended you download the example locally).

The first time the button is pressed after the page is refreshed,

if the browser's viewport height is large enough to contain the intended

dialog at its intended destination, with an additional remaining space of

say 15px, the dialog will be shown at an incorrect initial position, say,

20 to 30px above the intended position.

The second time (and third and forth) that the button is pressed, the

dialog will appear in the intended place; see: this example

Unfounded supposition by bug logger regarding possible cause:

I wonder if jQueryUI dialog positioning is somewhere considering a possible horizontal scrollbar or

statusbar that cover additional pixels on the lower edge of the viewport, and

moving the jqueryui dialog up further than it has to because of this?

Attachments (0)
Change History (5)

Changed January 04, 2012 05:35AM UTC by shotbolt comment:1

Forgot to add; I reproduced this in

  • Chrome 16.0.912.63m
  • IE 9.0.8112.16421
  • Firefox 7.01

Changed January 04, 2012 05:38AM UTC by shotbolt comment:2

Am using jQuery 1.8.13, and windows 7 enterprise x64.

Changed January 04, 2012 05:59AM UTC by shotbolt comment:3

Note: I had wanted to rename the Ticket to something more concise:

ui.dialog inconsistent positioning when near bottom viewport edge.

I have identified this problem near bottom viewport edge; I have not yet been able to establish if similar inconsistencies are observed near the left, right and top viewport edges.

Changed January 04, 2012 01:05PM UTC by scottgonzalez comment:4

resolution: → invalid
status: newclosed

This is working properly. You open the dialog, then hide the titlebar, which adjusts the height of the dialog.

Changed January 12, 2012 06:07AM UTC by shotbolt comment:5

agreed; my fault sorry.