Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Embed YouTube video with jQuery in IE6 without SWFObject

Here's my code:

<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<title></title>
<script>
$(document).ready(function(){
$("#video").html('<object width="480" height="385"><param name="movie" value="http://www.youtube.com/v/HPPj6viIBmU&hl=en_US&fs=1&"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/HPPj6viIBmU&hl=en_US&fs=1&" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="480" height="385"></embed></object>');
});
</script>
</head>
<body>
  <div id="video"></div>
</body>
</html>

It works with Firefox and Chrome, but something's not quite right in IE6. Sadly, one of the project requirements is supporting this browser, so even if it workis in IE7, I need to work this out.

I know there's SWFObject, but I'd rather not use it (we are loading already a bunch of JS files, we don't want more).

Even this won't work:

  <script>
document.write('<object width="480" height="385"><param name="movie" value="http://www.youtube.com/v/HPPj6viIBmU&hl=en_US&fs=1&"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/HPPj6viIBmU&hl=en_US&fs=1&" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="480" height="385"></embed></object>');
  </script>

It seems that IE6 ignores the <object> tag, here's the code it embeds.

<EMBED src=http://www.youtube.com/v/HPPj6viIBmU&amp;hl=en_US&amp;fs=1&amp; width=480 height=385 type=application/x-shockwave-flash allowfullscreen="true" allowscriptaccess="always"></EMBED>

Is there a workaround?

Thanks.

like image 978
metrobalderas Avatar asked Feb 22 '10 18:02

metrobalderas


2 Answers

The workaround you look for is going to end with you writing the equivilant of swfobject, except it won't be as well tested or perform as well. Why reinvent the wheel when there is a perfectly good existing solution, especially when it is only 10KB minified? if you are deadset on not adding another http request, why not slipstream the swfobject code into the page or into another js file.

I never use anything other than swfobject for embedding flash.

like image 154
micmcg Avatar answered Oct 28 '22 04:10

micmcg


This is a bit weird, because originally the object tag was inctroduced by MS to embed flash-objects.

Try to add the classid-parameter to your object-tag, eg:

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="300" height="120">
    <param name="movie" value="myContent.swf" />    
</object>
like image 1
Phil Rykoff Avatar answered Oct 28 '22 04:10

Phil Rykoff