View Full Version : Modal Window Mask and document.body Mask bugs multiple browsers Ext 4.0.2a / 4.0.5

4 Aug 2011, 11:27 AM
Firefox 3.6
Firefox 4
IE 7
IE 8

Ext Versions: 4.0.2a / 4.0.5

A mask added to the document.body only covers the existing window size upon scrolling down the mask does not cover the rest of the document.

A model window's mask also behaves the same way.

On a long form a user can click on a grid get a modal window and then scroll down and click on the form they are not supposed to be able to click until they've acted on the modal window.

19 Aug 2011, 8:35 AM
Ping! Hello! Anyone there?

6 Sep 2011, 10:53 AM
Similar Issue:

With so many issues with modal windows, & load masks can 4.0.7 focus on these please?

6 Sep 2011, 11:47 AM
@ValterBorges --

How is your document.body styled? overflow: ?, scroll: ?

6 Sep 2011, 12:55 PM
@media all {

body {
margin: 0;
padding: 0;
vertical-align: top;
background-color: #FFFFFF; font-size: 12px;
font-family: sans-serif, arial, 'Times New Roman';

* {
margin: 0;
padding: 0;

div {
margin: 0;
padding: 0;
border: 0;

13 Sep 2011, 10:43 AM
That's the thing about ExtJS. It expects you to use its layout managers which handle the scrolling issues for you. So therefore I don't really think it's a bug. But I have had cases where I wanted to use ExtJS to create a form or something similar on a regular webpage that scrolls (similar to what you're doing I guess). The work around that I used for now is to set the mask's style to have a position of fixed. This way when you scroll on the page, the mask overlays the entire window and doesn't move (except the content underneath it - but you still can't click it). Take it for what it's worth, might cause undesirable behaviour in other spots where you use masks. But it works in my case, maybe it will help you.

.x-mask {
position: fixed !important;

The only scenario I've seen this issue with is windows and modal dialogues as you said. Maybe the default behaviour for masks triggered by these object should implement the 'position: fixed' as the style. Or at least let the user specify absolute or fixed in the config.

13 Sep 2011, 12:38 PM
Thanks i'll try that work around.