I am trying to scale this video to 640x360. When I change the width and height, the video doesn't get bigger. I tried adding the parameters scale="aspect", scale="exactfit", scale="default". None of them worked.
Is there any way to scale this to 640x360?
Embed Code:
<object width="416" height="374" classid="clsid27CDB6E-AE6D-11cf-96B8-444553540000">
<param name="allowscriptaccess" value="always" />
<param name="movie" value="/.element/apps/cvp/3.0/swf/cnn_416x234_embed.swf?context=embed&videoId=us/2011/10/28/dnt-mom-learns-death-thru-facebook.wsyr" />
<embed src="/.element/apps/cvp/3.0/swf/cnn_416x234_embed.swf?context=embed&videoId=us/2011/10/28/dnt-mom-learns-death-thru-facebook.wsyr" type="application/x-shockwave-flash" allowscriptaccess="always" width="416" height="374">
</embed>
</object>
This didn't work either:
<script type="text/javascript" src=".min.js"></script>
<object width="416" height="374" classid="clsid27CDB6E-AE6D-11cf-96B8-444553540000">
<param name="allowscriptaccess" value="always" />
<param name="movie" value="/.element/apps/cvp/3.0/swf/cnn_416x234_embed.swf?context=embed&videoId=us/2011/10/28/dnt-mom-learns-death-thru-facebook.wsyr" />
<embed src="/.element/apps/cvp/3.0/swf/cnn_416x234_embed.swf?context=embed&videoId=us/2011/10/28/dnt-mom-learns-death-thru-facebook.wsyr" type="application/x-shockwave-flash" allowscriptaccess="always" width="416" height="374">
</embed>
</object>
<script>
function testcode () {
$('object').attr('width','640');
$('object').attr('height','500');
$('object embed').attr('width','640');
$('object embed').attr('height','500');
}
</script>
<br>
<a href="#" onclick="testcode()">click to test</a>
This displays as:
I am trying to scale this video to 640x360. When I change the width and height, the video doesn't get bigger. I tried adding the parameters scale="aspect", scale="exactfit", scale="default". None of them worked.
Is there any way to scale this to 640x360?
Embed Code:
<object width="416" height="374" classid="clsid27CDB6E-AE6D-11cf-96B8-444553540000">
<param name="allowscriptaccess" value="always" />
<param name="movie" value="http://i.cdn.turner./cnn/.element/apps/cvp/3.0/swf/cnn_416x234_embed.swf?context=embed&videoId=us/2011/10/28/dnt-mom-learns-death-thru-facebook.wsyr" />
<embed src="http://i.cdn.turner./cnn/.element/apps/cvp/3.0/swf/cnn_416x234_embed.swf?context=embed&videoId=us/2011/10/28/dnt-mom-learns-death-thru-facebook.wsyr" type="application/x-shockwave-flash" allowscriptaccess="always" width="416" height="374">
</embed>
</object>
This didn't work either:
<script type="text/javascript" src="http://code.jquery./jquery.min.js"></script>
<object width="416" height="374" classid="clsid27CDB6E-AE6D-11cf-96B8-444553540000">
<param name="allowscriptaccess" value="always" />
<param name="movie" value="http://i.cdn.turner./cnn/.element/apps/cvp/3.0/swf/cnn_416x234_embed.swf?context=embed&videoId=us/2011/10/28/dnt-mom-learns-death-thru-facebook.wsyr" />
<embed src="http://i.cdn.turner./cnn/.element/apps/cvp/3.0/swf/cnn_416x234_embed.swf?context=embed&videoId=us/2011/10/28/dnt-mom-learns-death-thru-facebook.wsyr" type="application/x-shockwave-flash" allowscriptaccess="always" width="416" height="374">
</embed>
</object>
<script>
function testcode () {
$('object').attr('width','640');
$('object').attr('height','500');
$('object embed').attr('width','640');
$('object embed').attr('height','500');
}
</script>
<br>
<a href="#" onclick="testcode()">click to test</a>
This displays as:
Share Improve this question edited Oct 29, 2011 at 21:19 supercoolville asked Oct 29, 2011 at 19:21 supercoolvillesupercoolville 9,10621 gold badges55 silver badges70 bronze badges3 Answers
Reset to default 2You can use the following jQuery script:
$(window).resize(function(){
$('object').attr('width','640');
$('object').attr('height','360');
$('object embed').attr('width','640');
$('object embed').attr('height','360');
});
See the result on JSFiddle
OR
You can use SWF Object. It is an easy-to-use and standards-friendly method to embed Flash content, which utilizes one small JavaScript file.
Edited:
<html>
<head><title>SWF example by jQuery</title></head>
<body>
<script type="text/javascript" src="http://code.jquery./jquery.min.js"></script>
<object width="416" height="374" classid="clsid27CDB6E-AE6D-11cf-96B8-444553540000">
<param name="allowscriptaccess" value="always" />
<param name="movie" value="http://i.cdn.turner./cnn/.element/apps/cvp/3.0/swf/cnn_416x234_embed.swf?context=embed&videoId=us/2011/10/28/dnt-mom-learns-death-thru-facebook.wsyr" />
<embed src="http://i.cdn.turner./cnn/.element/apps/cvp/3.0/swf/cnn_416x234_embed.swf?context=embed&videoId=us/2011/10/28/dnt-mom-learns-death-thru-facebook.wsyr" type="application/x-shockwave-flash" allowscriptaccess="always" width="416" height="374">
</embed>
</object>
<script>
function testcode () {
$('object').attr('width','640');
$('object').attr('height','500');
$('object embed').attr('width','640');
$('object embed').attr('height','500');
}
</script>
<br>
<a href="#" onclick="testcode()">click to test</a>
</body>
</html>
The problem is that you are resizing the browser/DOM's embed element but not actually scaling the content (the Flash animation) that is embedded.
Look at the SWF URL you are referencing: cnn_416x234_embed.swf. The animation is hardcoded to 416x234 and is going to play back at that size no matter what you do to the HTML around it.
A few ways to do what you want:
a) Find a CNN embed URL that is piled to work at the size you want, 640x360. Then, just hardcode the HTML embed element to that size (unless there's another reason you want to use Javascript).
b) Open up Flash, and create an "animation" that just loads the CNN SWF into a frame and scales it to the size you want. Save and export out to SWF, and embed this animation in your page.
c) Flash is fully scriptable via ActionScript (Javascript and ActionScript are both just ECMAscript), and since you have set allowscriptaccess="always" you should be able to manipulate the animation with Javascript. Run the CNN SWF in a debugger, find out what elements you need to resize, and scale them.
Solution (a) is obviously the simplest and best, assuming it exists, since you'd want to use video that is actually encoded at the size you want, not encoded at 416px wide and then scaled. Personally, if that doesn't work I don't really agree with scaling the video by 1.5x, it's not going to look good.
Edit/add: See my ments below. Because of the cross-domain issue, unfortunately the answer is that it is not possible to manipulate the size of objects inside a third-party SWF (CNN's, in this case). If this were your SWF, or if cross-domain access were enabled in system.Security, then the suggested solutions would work. But in this case, CNN's SWF is locked down so as not to permit cross-domain access.
So, unfortunately, the answer is that if CNN doesn't publish a video widget in the size you want (my (a) solution), you're out of luck, sorry. It's not possible to do what you want. I'll leave the full answer here in case it helps someone else.
look at the url of the .swf file that you are embedding. that size is hardcoded in all the .swf files. http://i.cdn.turner./cnn/.element/apps/cvp/3.0/swf/cnn_416x234_embed.swf?context=embed&videoId=us/2011/10/28/dnt-mom-learns-death-thru-facebook.wsyr
thats just one of them but that size is hardcoded dude. i guess if you know actionscript you could get up in it, but i don't. maybe you could do it, actually you can i just have no clue how, with javascript.