Ext学习之3_类Element和Fx4

Ext.namespace("com.deng");
/**
 * scale(Number width, Number height,[Object options])
 *  以动画展示元素从开始的高度/宽度转换到结束的高度/宽度
 * 参数：
 *   width： 结束宽度，如果为undefined则保持原始高度
 *   height：结束高度，如果为undefined为保持原始高度
 */
/**
Ext.onReady(function(){
	
	Ext.get("a1").applyStyles({
		position: "absolute",
		top: 200,
		left: 700,
		backgroundColor: "red",
		width: 10,
		height:10
	}).scale(100,100,{duration:2});
	
});
*/

/**
 * shift(Object options): 以动画展示元素任意组合属性的改变，如元素的尺寸、位置坐标和(或)透明度。如果以上属性中的
 * 任意一个没有在配置选项对象中指定则该属性不会发生改变。为了使该特效生效，则必须在配置选项对象中设置至少一个新的尺寸、位置
 * 坐标或透明度属性
 */
/**
Ext.onReady(function(){
	Ext.get("a1").applyStyles({
		position:"absolute",
		top: 200,
		left: 800,
		backgroundColor: "red",
		width: 10,
		height: 10
	}).shift({
		width: 100,//动画终止之后的宽度
		height: 100,//动画终止之后的高度
		x: 0,
		y: 0,
		opacity: .5,//动画终止之后的透明度，0-1之间的任意值
		duration: 5//动画持续的时间
	})
});
*/

/**
 * ghost([String anchor],[Object options])
 * 将元素从视图滑出并伴随着渐隐,anchor同slideIn
 * 
 */
Ext.onReady(function(){
	Ext.get("a1").applyStyles({
		position:"absolute",
		top: 200,
		left: 800,
		backgroundColor: "red",
		width: 100,
		height: 100
	}).ghost("b",{
		easing: "easeOut",
		duration: .5,
		remove: false,
		useDisplay: false
	})
});