Skip to main content

Search and Top Navigation

#7659 closed enhancement (wontfix)

Opened August 21, 2011 11:50AM UTC

Closed August 31, 2011 12:28AM UTC

Suggestion for overlay improvement in jquery-ui-1.8.16.custom.css

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

I like the dark background screen effect when using a modal dialog, but have found that it scrolls with the page, so that the darkening effect does not cover the whole document.

I'd like to suggest that the .ui-widget-overlay class is changed to from 'position: absolute' to 'position: fixed' in order to prevent it scrolling as the document is scrolled. This allows the darkened background to cover the document, regardless of vertical scroll position.

I also adjusted the width to 90%, to avoid a horizontal scroll-bar being created when a vertical scroll-bar is present (though this may not be ideal for shorter pages that dont have a vertical scroll-bar and there may well be better ways of handling this problem):

.ui-widget-overlay { position: fixed; top: 0; left: 0; width: 90%; height: 100%; }

Kind regards,

Steve Taylor

Attachments (0)
Change History (2)

Changed August 22, 2011 11:52AM UTC by rdworth comment:1

component: ui.coreui.dialog

Changed August 31, 2011 12:28AM UTC by scottgonzalez comment:2

resolution: → wontfix
status: newclosed

The overlay isn't really intended to be used without scripting to control the size. We can't rely on fixed positioning since it isn't supported in older browsers that we support, like IE 6.