Link to home
Start Free TrialLog in
Avatar of itcdr
itcdrFlag for United States of America

asked on

How to use Javascript to Resize Flash Player

How do I resize a flash player with javascript? I want to do so without reloading the player. I am currently using the SWFObject.

Any ideas?
<div id="myplayer"></div>
<script type="text/javascript">
  var so = new SWFObject('player.swf','playerapp','510','295','9');
  so.addParam('allowfullscreen','true');
  so.write('myplayer');
</script>

Open in new window

Avatar of kishoregp
kishoregp
Flag of United Arab Emirates image

I don't think you can resize the stage.  But you can have a big stage, with scaling content and stage transparent (which you can do with publish settings or so.addParam('wmode','transparent');)

Hope this helps
Avatar of itcdr

ASKER

I can already set the size to anything with javascript. Currently 510x295. I just don't know how to change it after it's already loaded.
var so = new SWFObject('player.swf','playerapp','510','295','9');

Open in new window

the 510x295 you set in javascript would be only the container size and not the flash stage size.
may be try reducing this values and you will see that the flash content being cropped, if I am not wrong.
Avatar of itcdr

ASKER

I can change those container sizes to anything and flash does resize. So now I need to have an option to change the container size after its loaded. That way users can switch between small and big screen without reloading the page
can you attach the swfObject class/js file?
rename to .txt and attach.

if you can resize flash, then there should be some property where you can directly change.. like,
so.width or so..
Avatar of itcdr

ASKER

I'm using the swfobject.js from here:

http://www.jeroenwijering.com/embed/swfobject.js

and following this tutorial for embeding flash: http://www.jeroenwijering.com/?item=embedding_flash
ASKER CERTIFIED SOLUTION
Avatar of kishoregp
kishoregp
Flag of United Arab Emirates image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of itcdr

ASKER

that does change the size, but it also reloads the flash player which is pretty large. For example, the code below can resize a flash player without reloading it.

but I want to use the SWFObject as it allows things like single-click player in Internet Explorer. Normally you have to click first to activate flash then again to play.
<embed id="myplayer" src="player.swf" width="510" height="295" allowfullscreen="true" />
 
<script>
 document.getElementById('myplayer').width='1000'; 
 document.getElementById('myplayer').height='1000'; 
</script>

Open in new window

Avatar of itcdr

ASKER

I figured it out. I looked at the SWFObject code more and realized they basically just used an embed code like above and used the second parameter from the first command as the ID. So the code below did the trick. you did put me on the right direction though. thank you!

<div id="myplayer"></div>
<script type="text/javascript">
  var so = new SWFObject('player.swf','playerapp','510','295','9');
  so.addParam('allowfullscreen','true');
  so.write('myplayer');
 
  function change(w,h) {
   document.getElementById('playerapp').width=w; 
   document.getElementById('playerapp').height=h; 
  }
</script>

Open in new window

I was just working on that : )
Good that you got to solve it.
don't forget, you will have to accept as solution..
the time was also for points ;)