Using YUI3 Animation to change the height of a swfobject. View a demo here. Download the FLA file here.
//ActionScript 3
stage.align = StageAlign.TOP_LEFT;
stage.scaleMode = StageScaleMode.NO_SCALE;
toggle_txt.x = toggle_txt.y = 10;
toggle_txt.text = "Toggle Height (click) StageHeight = "+String(stage.stageHeight);
toggle_txt.buttonMode = true;
toggle_txt.addEventListener(MouseEvent.CLICK, fl_MouseClickHandler);
function fl_MouseClickHandler(event:MouseEvent):void
{
ExternalInterface.call('toggleSize');
}
stage.addEventListener(Event.RESIZE, resizeHandler);
function resizeHandler(evt:Event):void
{
toggle_txt.text = "Toggle Height (click) StageHeight = "+String(stage.stageHeight);
}
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Expand Stage</title>
<script type="text/javascript" charset="utf-8" src="http://yui.yahooapis.com/3.2.0/build/yui/yui-min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script>
<script type="text/javascript">
var flashvars = {};
var params = {allowscriptaccess:"always"};
var attributes = {};
swfobject.embedSWF("toggle_size.swf", "banner", "960", "60", "10.0.0", false, flashvars, params, attributes);
</script>
<style type="text/css">
@import url("http://yui.yahooapis.com/combo?3.2.0/build/cssfonts/fonts-min.css&3.2.0/build/cssreset/reset-min.css");
</style>
</head>
<body>
<div id="banner"></div>
<script type="text/javascript">
function toggleSize() {
YUI().use('node','anim', function(Y) {
var b = Y.one("#banner");
//Y.log(b);
if (b.getStyle('height') === '120px'){
var bAnim = new Y.Anim({
node: '#banner',
to: {
height:60
}
});
bAnim.run();
} else if (b.getStyle('height') === '60px') {
var bAnim = new Y.Anim({
node: '#banner',
to: {
height:120
}
});
bAnim.run();
}
});
}
</script>
</body>
</html>
Links:
- AS3 External Interface
[Update - I've redone this example with jQuery here.]