change properties of flash video object using jQuery/javascript/css

Question

I have an iframe which plays flash object (video)

Inside the iframe it has

<object id="objectId" width="640" height"640" data="name.swf?v=1.2">
</object>

Now i tried to change the width and height of this object using javascript and jquery but its not changing !

Here is the code that i tried

$("#objectId").css({"width":"790px"})  //also tried without px
document.getElementById("objectId").style.width="790"

also $("#objectId") returns [] in console

I have this video embedded inside an iframe inside a div

the structure is like

<div id="container">
<iframe src="blabla/bla.swf">
<object id="objectId" width="640" height"640" data="name.swf?v=1.2">
</object>
</iframe>
</div>

So i tried to access the html inside the div using $("#container").html() This returned only the iframe and not the contents generated inside it!!

Answer 1

I ran into a similar problem once. What you can try is like

var cssLink = document.createElement("link")
cssLink.href = "style.css";
cssLink .rel = "stylesheet";
cssLink .type = "text/css";
window.frames[0].document.body.appendChild(cssLink);

Try this out it may help you though i'm not sure but it worked for me. Where the style.css is the css file where you specify your styling for the frame

Answer 2

Well first you can fix the error you have in you code here

this height"640" must be height="640"

the Js should be this:

$( document ).ready(function() {
    $('#objectId').css({'height': 300, 'width':300});
});