ExtJS 4.2.1 Different CSS Mask for loading indication and Modal Window

Question

I am working on a ExtJS 4.2.1 application which contains lot of alerts and Ajax call.

I found out that the same CSS class for the mask (.x-mask)is used for the loading and the modal mask when showing windows modally.

How can I use different behaviors for these two different things?

Problem:

1. For Modal window i need to get the red as a background color
2. For Loading mask i need to get the green as a background color

Any Help will be greatly appreciated.

Answer 1

Since both of loading and modal is using the same mask . I use the hack to solve the issue. use the below css.

div.x-message-box + div.x-mask {
background: red;
}

You could use the sibling selector to solve the issue.

Answer 2

对于loadMask，请使用maskCls更改蒙版样式