Отключить серый фон loadMask в Сенча Touch

Question

У меня есть loadMask. Это устанавливает серый фон и поверх этого загрузочного изображения, которое указывает «Загрузка». Из the documentation:

// Basic mask: 
var myMask = new Ext.LoadMask(Ext.getBody(), {msg:"Please wait..."}); 
myMask.show(); 

Проблема заключается в том, я хочу только небольшую площадь с погрузочным изображением и меткой «загрузка ...», мне нужно избавиться от серого фона.

Этот серый фон получить рассвет в .x-маске x-mask-gray div. Я попытался установить CSS этого div на разные значения для ширины и высоты, но я не могу заставить его работать.

вот HTML:

<div class="x-mask x-mask-gray" id="ext-gen1099" style="width: 1124px; height: 575px; "> 
    <div class="x-mask-loading"> 
    <div class="x-loading-spinner"> 
     <span class="x-loading-top"></span> 
     <span class="x-loading-right"></span> 
     <span class="x-loading-bottom"></span> 
     <span class="x-loading-left"></span> 
    </div> 
    <div class="x-loading-msg">Loading...</div> 
    </div> 
</div> 

Если вы видите, ширина устанавливается на 1124px и высотой до 575px, мне нужно, чтобы исчезнуть, сделать его 0px или удалить все х-маски-серый, но без удаление дочерних узлов. И, надеюсь, просмотрите ярлык «Загрузка ...».

Надеюсь, вы можете мне помочь, любые предложения очень ценятся.

Answer 1

Ваш лучший вариант - переопределить эти стили, но просто сделать прозрачный фон вместо того, чтобы полностью удалить DIV.

Если вы добавите следующий CSS, он оставит прозрачный фон маски.

.x-mask, .x-mask.x-mask-gray 
{ 
    background-color: transparent; 
} 

В качестве альтернативы, можно переопределить onBeforeLoad метода, Ext.LoadMask и передать в истинном качестве последнего параметра метода маски() (который является «прозрачным» параметром), который удалит й-маску -Грэй класс от маскирующего DIV, как показано ниже:

var myMask = new Ext.LoadMask(Ext.getBody(), { 
    msg: "Please wait...", 
    onBeforeLoad: function(){ 
      if (!this.disabled) { 
       this.el.mask(Ext.LoadingSpinner + '<div class="x-loading-msg">' + this.msg + '</div>', this.msgCls, false); 
       this.fireEvent('show', this, this.el, this.store); 
      } 
     } 
    }); 
    myMask.show(); 

к сожалению, вы все еще нуждаются в CSS переопределение для класса .x-маски с этим решением, так как он все еще добавляет 30% непрозрачности фона.

Надеется, что это помогает

Стюарт