Ext JS disabled Panel mask Opacity

Question

How can I control to opacity of a disabled panel with a mask. I would like to disable to the panel (meaning It will be touchable) and leave its opacity as is. Thx

Answer 1

You can create your own CSS style sheet that overrides ExtJS's default style sheet for disabled items. In ext-all.css, there are several style configurations for the .x-item-disabled class that you can take a look at. For example, they specify the opacity for toolbar button icons like so:

.x-toolbar .x-item-disabled .x-btn-icon {
    opacity: .35;
    -moz-opacity: .35;
    filter: alpha(opacity=35);
}

So you'll have to look up what class your panel belongs to and construct a style sheet that includes specification for your particular selectors.

CSS Syntax (Wikipedia)