How to get 'overlay' effect without using 'overlay' config in titlebar?

[shri_iitk]

I want image title to be shown over the image and for that I used a docked titlebar on top of image and made it transparent using CSS. My problem is {overlay : true} because of which I am getting these warnings:

[DEPRECATE][Ext.Panel#doAdd] 'overlay' config is deprecated on docked items, please set the top/left/right/bottom configurations instead.

I tried playing with top/left/right configs but still not able to get effect similar to overlay, can someone tell me how to do the same without using overlay?
I am using Sencha Touch 2.1

Here is code for panel:

    {
        xtype: 'panel',
        layout: 'vbox',
        items : [{
                xtype : 'toolbar',
                title : titleStr,
                docked : 'top',
                overlay : true,
                cls : 'x-toolbar-transparent-top'
        },{
                xtype: 'image',
                layout: 'fit',
                flex : 1,
                rec : data,
                src : data.imageURL,
                width : Ext.Viewport.getWindowWidth()*3/4,
        }
        }]
    }

[mitchellsimoens]

Docked items won't use the top/left/etc. You can undock it and use top/left and width to see if that works for you.

[shri_iitk]

Thanks Man!
I did not know that docked items doesn't use top/left positioning
It seems to be working fine

                               {
        				xtype : 'toolbar',
        				title : titleStr,
        				//docked : 'top',	// Docked removed because absolute positioning doesn't work with it and overlay is deprecated
        				top : 0,
        				left : 0,
        				width : Ext.Viewport.getWindowWidth()*3/4,
        				//overlay : true,
        				cls : 'x-toolbar-transparent-top'
        			}