PDA

View Full Version : Docked Items and Z-index inline style



gcallaghan
5 Jan 2011, 2:52 PM
I'd like to have one docked item slide out from beneath another. To do this I want to set the z-index style of the 'lower' docked item to 4 ,rather then the standard 5 as defined in the stylesheet. (The slide animation references the elements z-index style attribute). However, using the standard style{'z-index':4} appears to be clobbered somewhere along the line. I've attempted to dive into the touch source but am at a loss as to where this is happening.

I was wondering if a dev could point me in the right direction. Thanks!

gcallaghan
5 Jan 2011, 4:26 PM
Found it. The slide animation was aggressively clobbering the components style upon completion.

pothibo
24 Feb 2011, 10:09 AM
Do you mind sharing your solution? :P

gcallaghan
24 Feb 2011, 10:25 AM
style:{
'z-index':3
},
listeners:{
afterrender:function(){
var fromY = this.getHeight()*-1;

this.showAnimation=new Ext.Anim({
direction: 'down',
reveal:true,
autoClear:true,
easing:'ease-out',
from : {
'-webkit-transform': 'translate3d(' + 0 + 'px, ' + fromY + 'px, 0)'
},
to:{
'-webkit-transform': 'translate3d(' + 0 + 'px, ' + 0 + 'px, 0)'
}

});
}

pothibo
24 Feb 2011, 10:25 AM
Thank you!