PDA

View Full Version : Window Animation



ma_nepali_keta
13 Aug 2010, 11:57 PM
Hi
Good Evening.

I have the following code which works perfectly fine.



Ext.onReady(windowAnimate);
function windowAnimate()
{
var button = new Ext.Button({
text:'Show Window',
id:'myButton',
renderTo:document.body,
handler: function(){

myWindow.show();
} }
) ;

var myWindow= new Ext.Window({
animateTarget:button.el,
title:'My Fancy Window',
id:'myWindow',
width:300,
height:150,
closeAction:'hide',
constrain:true,
});
}


The window will be display on the center of the page using Slide In(I guess it's slide in,plz correct me if i am wrong) effect. Is it possible to change this effect to another one. Let's say If i want the window to fade in while popping up how would be i able to do so. I tried Ext.Fx.ItsMethods(), using window id, but didn't find any luck..

Any hints, suggestions, urls anything will be greatly appreciated.

Thank you
Have a nice weekend

ashaihullin
14 Aug 2010, 12:36 AM
what about this:



Ext.onReady(windowAnimate);
function windowAnimate()
{
var button = new Ext.Button({
text:'Show Window',
id:'myButton',
renderTo:document.body,
handler: function(){

myWindow.show();
myWindow.getEl().fadeIn({
endOpacity: 0, //can be any value between 0 and 1 (e.g. .5)
easing: 'easeOut',
duration: .9,
remove: false,
useDisplay: false
});
} }
) ;

var myWindow= new Ext.Window({
animateTarget:button.el,
title:'My Fancy Window',
id:'myWindow',
width:300,
height:150,
closeAction:'hide',
constrain:true
});
}