PDA

View Full Version : Slide in overlay



devians
6 Sep 2010, 4:42 PM
Hey guys, i'd like to have a prebuilt area on my extjs application, perhaps a region in my viewport, that i can trigger fairly easily and load up with whatever. I'd like to have it slide in from the right hand side, and mask whatever else is 'behind' it. I have been experimenting with collapsing and disabling panels, but theres really no combination of things here that equate to what i need.

I'm thinking i need to build an extension of .Panel that can be created and triggered to animate in. I'm not really sure how to start however, does anyone have any pointers?

Animal
6 Sep 2010, 9:29 PM
var parentEl = <element to slide the Panel into>;
var myPanel=new Ext.Panel({renderTo: paretel,
title: 'I slide in',
height:200,
width:200
});
myPanel.el.alignTo(parentEl, 'r-r');
myPanel.el.slideIn('r');

devians
6 Sep 2010, 9:50 PM
Thanks for the reply!

I'm using a border layout for my viewport, so in attaching to my center region as the parentEl, i get what the correct panel. I have a few questions related to size and position. I would like this panel to be the same height as its parent, and aligned to the top, rather than the center. I have had a play around with the config options but i cannot seem to coax this result out of it?