In the following code Only the button image has been embeded into the flex code.But in the html object or embed tag why the height and width has to be specified.Even though for this is a normal button if we do not specify the height and width there seems to be some error
html
<div align="center">
<br />
<div style="display:block;width:100px;height:100px;" id="audio"
class="testsound" align="center"/>
<p class="clickable">
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
width="400" height="100" id="myMovieName">
<param name="movie" value="/media/players/testsound.swf"/>
<param name="soundurl" value="/media/players/music.mp3"/>
<param name="quality" value="high"/>
<param name="bgcolor" value="#FFFFFF"/>
<embed width="100" height="100" href="/media/players/testsound.swf"
src="/media/players/testsound.swf"
flashvars="soundUrl=/media/players/music.mp3"
quality="high" bgcolor="#FFFFFF"
name="myMovieName" loop="false" align=""
type="application/x-shockwave-flash">
</embed>
</object>
</p>
</div>
MXML
<?xml version="1.0"?>
<!-- embed/EmbedSound.mxml -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:Script>
<![CDATA[
import flash.media.*;
public var snd:Sound = new sndCls() as Sound;
public var sndChannel:SoundChannel;
public function playSound():void {
sndChannel=snd.play();
}
]]>
</mx:Script>
<mx:Image id="loader1" click="playSound();"
source="@Embed(source='/opt/cloodon/site/media/img/speaker.gif')" />
</mx:Application>
Height and Width in an embed tag are required attributes. Have a gander at swfobject or Adobe on the tag definition as well as required and optional attributes.
Are you asking why they're required or why your page will break if you don't have them (hint, the first answer is the second question)?
EDIT:
You should modify the width and height attribute of the EMBED and OBJECT tags to be exactly to the size of the swf.
You can set your application width and height in the .mxml
<mx:Application width="300" height="200">
If you set the scaleMode to "noScale" you won't see any scaling in your swf.
stage.scaleMode = StageScaleMode.NO_SCALE;
stage.align = StageAlign.TOP_LEFT;
If you're in Actionscript 3 (which you should be), you can set the meta-data in your main class.
i.e.
[SWF(width="640", height="480")]
public class MyClass extends Sprite
{
public function MyClass()
{
stage.scaleMode = StageScaleMode.NO_SCALE;
stage.align = StageAlign.TOP_LEFT;
}
}