Opened 8 years ago

Closed 8 years ago

#7659 closed enhancement (wontfix)

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

Change History (2)

comment:1 Changed 8 years ago by rdworth

Component: ui.coreui.dialog

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

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.

Note: See TracTickets for help on using tickets.