HTML swf container resize - html

I have a kinda simple flash file. Just one layer. For the first 50 frames I just have an img file which has 300px height.
At 51 frame i load another image with the same width but with 150px height.
I have this code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<title>masterhead</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css" media="screen">
html, body { height:100%; background-color: #ffffff;}
body { margin:0; padding:0; overflow:hidden; }
#flashContent { width:100%; height:100%; }
</style>
</head>
<body>
<div id="flashContent">
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="980" height="235" id="masterhead" align="middle">
<param name="movie" value="masterhead.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#ffffff" />
<param name="play" value="true" />
<param name="loop" value="true" />
<param name="wmode" value="window" />
<param name="scale" value="showall" />
<param name="menu" value="true" />
<param name="devicefont" value="false" />
<param name="salign" value="" />
<param name="allowScriptAccess" value="sameDomain" />
<!--[if !IE]>-->
<object type="application/x-shockwave-flash" data="masterhead.swf" width="980" height="235">
<param name="movie" value="eradio_masterhead.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#ffffff" />
<param name="play" value="true" />
<param name="loop" value="true" />
<param name="wmode" value="window" />
<param name="scale" value="showall" />
<param name="menu" value="true" />
<param name="devicefont" value="false" />
<param name="salign" value="" />
<param name="allowScriptAccess" value="sameDomain" />
<!--<![endif]-->
<a href="http://www.adobe.com/go/getflash">
<img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" />
</a>
<!--[if !IE]>-->
</object>
<!--<![endif]-->
</object>
</div>
<div>
<br> just some text </br>
</div>
</body>
</html>
Problem is that swf container doesn't resize at the frame 51.
How I ccan do that;
Thank you

Simply ** Flash Cant**
The SWF file is a container pre compiled file, It will not resize as the properties of the file are already declared when you compiled it and in your parameters tags.
Html divs with Css will also not resize the SWF as the page is separate and has no interactivity with the flash content already displayed.
Im not too sure if this would be possible with javascript during runtime, but that is another question....

Related

full screen code in HTML and CSS

I have a question of how to make the content in a full screen, there are codes of my content:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<title>main</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css" media="screen">
html, body { height:100%; background-color: #000000;}
body { margin:0; padding:0; overflow:hidden; }
#flashContent { width:100%; height:100%; }
</style>
</head>
<body>
<div id="flashContent">
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="800" height="600" id="main" align="middle">
<param name="movie" value="main.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#000000" />
<param name="play" value="true" />
<param name="loop" value="true" />
<param name="wmode" value="window" />
<param name="scale" value="showall" />
<param name="menu" value="true" />
<param name="devicefont" value="false" />
<param name="salign" value="" />
<param name="allowScriptAccess" value="sameDomain" />
<!--[if !IE]>-->
<object type="application/x-shockwave-flash" data="main.swf" width="800" height="600">
<param name="movie" value="main.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#000000" />
<param name="play" value="true" />
<param name="loop" value="true" />
<param name="wmode" value="window" />
<param name="scale" value="showall" />
<param name="menu" value="true" />
<param name="devicefont" value="false" />
<param name="salign" value="" />
<param name="allowScriptAccess" value="sameDomain" />
<!--<![endif]-->
<a href="http://www.adobe.com/go/getflash">
<img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" />
</a>
<!--[if !IE]>-->
</object>
<!--<![endif]-->
</object>
</div>
</body>
The current content in webpage is located in left corner and it is not a full size, I know how to make it centered but I have no idea how to make it as a full screen display, please advise, thank you.
You are specifying width and height to object itself. Remove width and height properties, or change it to percentage.
<object style="width: 100%; height: 100%;" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" id="main">
Take a look to the fullscreen API of (HTML5) that could be useful to you. http://slides.html5rocks.com/#fullscreen-api
Instead of
#flashContent { width:100%; height:100%; }
Try this:
#flashContent object{
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
}

Control buttons missing after flash published Adobe Flash cs6

I have been trying do do what I thought would be very simple, but so far each time I publish the flash file on Adobe Flash cs6, I do not see the control panel below the vid with the start/pause, timeline, volume, full-screen buttons/controls. They are always missing.
Using adobe flash cs6 I create a new fla file, import an flv vid into it, then choose a pre-selected control 'skin'. It is like the most basic thing you can do.
Once I do that, the volume controls appear where they should, just below the vid, in the 'Scene' window of adobe flash before i attempt to publish it to the swf file (so i can use it on the web)
That is all I want. Import the vid, get the controls, and publish.
When I publish, the vid works fine but the control panel / bar is missing. I have uploaded all the files produced by Adobe Flash cs6 that resulted from the publication to the server. Everything is in the same folder.
The resulting html code looks like this:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<title>vid2</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css" media="screen">
html, body { height:100%; background-color: #ffffff;}
body { margin:0; padding:0; overflow:hidden; }
#flashContent { width:100%; height:100%; }
</style>
</head>
<body>
<div id="flashContent">
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="375" height="260" id="vid2" align="middle">
<param name="movie" value="vid2.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#ffffff" />
<param name="play" value="true" />
<param name="loop" value="true" />
<param name="wmode" value="window" />
<param name="scale" value="showall" />
<param name="menu" value="true" />
<param name="devicefont" value="false" />
<param name="salign" value="" />
<param name="allowScriptAccess" value="sameDomain" />
<!--[if !IE]>-->
<object type="application/x-shockwave-flash" data="vid2.swf" width="375" height="260">
<param name="movie" value="vid2.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#ffffff" />
<param name="play" value="true" />
<param name="loop" value="true" />
<param name="wmode" value="window" />
<param name="scale" value="showall" />
<param name="menu" value="true" />
<param name="devicefont" value="false" />
<param name="salign" value="" />
<param name="allowScriptAccess" value="sameDomain" />
<!--<![endif]-->
<a href="http://www.adobe.com/go/getflash">
<img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" />
</a>
<!--[if !IE]>-->
</object>
<!--<![endif]-->
</object>
</div>
</body>
But no control panel

Flash element not transparent in Firefox

I put a flash mp3 player element in my HTML page.
This element has a transparent background.
<div id="player">
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="100" height="30" id="mp3player" align="middle">
<param name="movie" value="mp3player.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#000000" />
<param name="play" value="true" />
<param name="loop" value="true" />
<param name="wmode" value="transparent" />
<param name="scale" value="showall" />
<param name="menu" value="true" />
<param name="devicefont" value="false" />
<param name="salign" value="" />
<param name="allowScriptAccess" value="sameDomain" />
<!--[if !IE]>-->
<object type="application/x-shockwave-flash" data="mp3player.swf" width="100" height="30">
<param name="movie" value="mp3player.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#000000" />
<param name="play" value="true" />
<param name="loop" value="true" />
<param name="wmode" value="transparent" />
<param name="scale" value="showall" />
<param name="menu" value="true" />
<param name="devicefont" value="false" />
<param name="salign" value="" />
<param name="allowScriptAccess" value="sameDomain" />
<!--<![endif]-->
<a href="http://www.adobe.com/go/getflash">
<img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" />
</a>
<!--[if !IE]>-->
</object>
<!--<![endif]-->
</object>
</div>
Firefox in Windows 7 displays a transparent background while it does not happen with Windows XP.
How can this problem be solved?
Thanks
EDIT
I noticed that my flash element at the start has a transparent background but after mouse-over the background turns black and stays black.
Is possible using jquery to force the flash wmode parameter trasparent on mouse-over and/or
mouse-out?
Thanks
While you have:
<param name="wmode" value="transparent" />
You still need this as an attribute on the object tag:
<object wmode="transparent" ....

SWF doesn't show up

I don't have a clue on what I'm doing wrong. Sometimes, when I open this page my html page , the swf don't appear. It won't happen always, but is really frequent.
Important: when it don't appear, I do can hear the sounds that the swf movie makes. In other words, I'm shure that the object is on the page, but it just won't be visualizable.
The error occurs on Firefox and Chrome (I didn't see it happening with IE, but I won't doubt that it is possible)
The problem isn't in the swf because I have already tested with another file that have no code at all and the same problem occurs.
Here is the page's code, generated by Flash CS5.5 when publishing the swf:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<title>Hellbound</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css" media="screen">
html, body { height:100%; background-color: #ffffff;}
body { margin:0; padding:0; overflow:hidden; }
#flashContent { width:100%; height:100%; }
</style>
</head>
<body style="background-color: #000000">
<div id="flashContent">
<p align="center">
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="640" height="500" id="Hellbound" align="middle">
<param name="movie" value="Hellbound_secure.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#ffffff" />
<param name="play" value="true" />
<param name="loop" value="true" />
<param name="wmode" value="gpu" />
<param name="scale" value="showall" />
<param name="menu" value="true" />
<param name="devicefont" value="false" />
<param name="salign" value="" />
<param name="allowScriptAccess" value="sameDomain" />
<!--[if !IE]>-->
<object type="application/x-shockwave-flash" data="Hellbound_secure.swf" width="640" height="500">
<param name="movie" value="Hellbound_secure.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#ffffff" />
<param name="play" value="true" />
<param name="loop" value="true" />
<param name="wmode" value="gpu" />
<param name="scale" value="showall" />
<param name="menu" value="true" />
<param name="devicefont" value="false" />
<param name="salign" value="" />
<param name="allowScriptAccess" value="sameDomain" />
<!--<![endif]-->
<a href="http://www.adobe.com/go/getflash">
<img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" />
</a>
<!--[if !IE]>-->
</object>
<!--<![endif]-->
</object>
</div>
</body>
</html>
I know it's tempting to use the embed code generated by the Flash authoring tool's Publish feature, but I've had much better luck with one of the javascript replacement methods. I'd look at SWFobject. It seems to be the most dependable embedding routine and it's pretty easy to use. ...plus, it does a good job of handling the foibles of the various browsers.
http://code.google.com/p/swfobject/

How do I access flashvars in AS3, and add them to an existing text field?

Edit: I've come to realize the main problem I'm facing is that I want a text field that already exists in a movieclip or on the stage to take the string from a flashvar. For some reason it will not do that. How do I make a pre-existing text field change to match the flashvar text?
Html:
<div id="flashContent">
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="100%" height="29px" id="egnewsTicker" align="middle">
<param name="movie" value="egnewsTicker.swf" />
<param name="flashvars" value="newslisttest=this is my test" />
<param name="quality" value="high" />
<param name="bgcolor" value="#ffffff" />
<param name="play" value="true" />
<param name="loop" value="true" />
<param name="wmode" value="transparent" />
<param name="scale" value="showall" />
<param name="menu" value="false" />
<param name="devicefont" value="false" />
<param name="salign" value="lt" />
<param name="allowScriptAccess" value="sameDomain" />
<!--[if !IE]>-->
<object type="application/x-shockwave-flash" data="egnewsTicker.swf" width="100%" height="29px">
<param name="movie" value="egnewsTicker.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#ffffff" />
<param name="play" value="true" />
<param name="loop" value="true" />
<param name="wmode" value="transparent" />
<param name="scale" value="showall" />
<param name="menu" value="false" />
<param name="devicefont" value="false" />
<param name="salign" value="lt" />
<param name="allowScriptAccess" value="sameDomain" />
<param name="flashvars" value="newslisttest=this is my test" />
<!--<![endif]-->
<a href="http://www.adobe.com/go/getflash">
<img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" />
</a>
<!--[if !IE]>-->
</object>
<!--<![endif]-->
</object>
</div>
I know this is supposed to be a simple task, and I have found several web articles that give examples, but I simply cannot make it work when I'm trying to do my own code. All I want to do is pass a flashvar string and be able to access it by name in flash using AS3, but I can't seem to accomplish that.
I'm trying:
var paramObj:Object = LoaderInfo(this.root.loaderInfo).parameters;
newsItem.newsHeadline.text = String(paramObj[varName]);
I've also tried:
newsItem.newsHeadline.text = this.loaderInfo.parameters.newslisttest;
Nothing I try works, it always just stays blank. What is the trick to accessing flashvars in flash as3? I'm just not getting it and I can't find a good explanation anywhere...
Try this: stage.loaderInfo.parameters.yourparam or stage.loaderInfo.parameters["yourparam"]
Can you post your html code, so we can see how you pass the flashvars to Flash.
I've been wasted all the day long for that...
AS3:
var uid:String;
// your code
this.loaderInfo.addEventListener(Event.COMPLETE, loaderComplete);
// your code
function loaderComplete(e:Event=null):void
{
var fv = stage.loaderInfo.parameters;
uid = fv['uid'] || "'uid' not found";
}
HTML:
<object type='application/x-shockwave-flash' data='/flash/yourSWF.swf' width='320' height='240'>
<param name='wmode' value='transparent' />
<param name='FlashVars' value='uid=yourData' />
<param name='movie' value='/flash/yourSWF.swf' />
</object>
If you are still having this problem, follow below lines.
I used flash vars, they work fine for me.
My html script was:
<html>
<body>
<div id="flashContent">
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000"FlashVars="uid=123&name=santhu" width="100%" height="100%" id="index" align="middle">
<param name="movie" value="index.swf" />
<param name=FlashVars value="uid=123&name=santhu">
<!--[if !IE]>-->
<object type="application/x-shockwave-flash" data="index.swf"
FlashVars="uid=123&name=santhu" width="100%" height="100%">
<param name="movie" value="index.swf" />
<param name=FlashVars value="uid=123&name=santhu">
<!--<![endif]-->
<!--[if !IE]>-->
</object>
<!--<![endif]-->
</object>
</div>
</body>
</html>
and my AS code to load vars is
this.root.loaderInfo.addEventListener(Event.COMPLETE, SWFLoadComplete);
private function SWFLoadComplete(e:Event)
{
obj=this.root.loaderInfo.parameters;
trace(obj.uid , obj.name); // outputs: 123 santhu
}