如何将Panel的背景颜色设置为transperent

时间:2017-02-23 09:45:21

标签: javascript extjs extjs3

我已将我的面板配置设置为:bodyStyle: 'background:transparent;'但它无效。我也尝试过:defaults: { bodyStyle: 'background:transparent;' }

function cre1ColumnHboxForModErrMsg(itemA){
    var hb = new Ext.Panel(
        {   layout:'fit'
            ,height:75
            ,frame: false
            ,border: false
            ,bodyStyle: 'background:transparent;'
            ,layoutConfig:{ align:'top', pack:'center' }
            ,defaults:{ layout:'form', labelWidth:CampConst.CampModErrMsgLabelWidth ,width:175,border:false}
            ,items:[
                {   width:((CampConst.CampModErrMsgWidth/2)-30)
                    ,defaults:{ labelSeparator:'', msgTarget:'side', selectOnFocus:true,anchor:'95%' }
                    ,items:[
                        itemA
                    ]
                }
            ]
        }
    );
    return hb;
}

我哪里错了?

Screen shot

1 个答案:

答案 0 :(得分:1)

尝试style: 'background:transparent;' - 这适用于整个面板元素,而不仅仅是正文。

然而,据说你看起来并不真的需要一个面板,而且可以用一个容器代替:

function cre1ColumnHboxForModErrMsg(itemA){

    var hb = new Ext.Panel(
        {   layout:'fit'
            ,height:75
            ,frame: false
            ,border: false
            ,bodyStyle: 'background:transparent;'
            ,layoutConfig:{ align:'top', pack:'center' }
            ,defaults:{ layout:'form', labelWidth:CampConst.CampModErrMsgLabelWidth ,width:175,border:false}
            ,items:[
                {   width:((CampConst.CampModErrMsgWidth/2)-30)
                    ,defaults:{ labelSeparator:'', msgTarget:'side', selectOnFocus:true,anchor:'95%' }
                    ,items:[
                        itemA
                    ]
                }
            ]
        }
    );
    return hb;
}