I've been trying to play YouTube videos in a Fancybox pop out. It works perfectly in Firefox, Safari and Chrome, but in IE it doesn't display. It will pop out the Fancybox but the video won't display. It only shows [X] (red X in red box).

Here is the page: http://isis.brandtoolbox.com.au/about-isis/isis-tv.aspx

Using Firebug I established that it's not displaying the same code as what FF, Safari and Chrome display:

IE:

<div id="fancybox-inner" style="top: 0px; left: 0px; width: 640px; height: 360px; overflow: hidden;">
  <object width="640" height="360" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000">
  </object>
</div>

Other browers:

<div id="fancybox-inner" style="top: 0px; left: 0px; width: 640px; height: 360px; overflow: hidden;">
  <object width="640" height="360" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000">
    <param value="http://www.youtube.com/apiplayer?video_id=4haq3C7WwbM&amp;version=3&amp;enablejsapi=1&amp;playerapiid=ytplayer&amp;autoplay=1" name="movie">
    <param value="transparent" name="wmode">
    <embed width="640" height="360" wmode="transparent" type="application/x-shockwave-flash" src="http://www.youtube.com/apiplayer?video_id=4haq3C7WwbM&amp;version=3&amp;enablejsapi=1&amp;playerapiid=ytplayer&amp;autoplay=1">
  </object>
</div>

Here is the XSLT I'm using:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE xsl:stylesheet [ <!ENTITY nbsp "&#x00A0;"> ]>
<xsl:stylesheet
  version="1.0"
  xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
  xmlns:msxml="urn:schemas-microsoft-com:xslt"
  xmlns:umbraco.library="urn:umbraco.library" xmlns:Exslt.ExsltCommon="urn:Exslt.ExsltCommon" xmlns:Exslt.ExsltDatesAndTimes="urn:Exslt.ExsltDatesAndTimes" xmlns:Exslt.ExsltMath="urn:Exslt.ExsltMath" xmlns:Exslt.ExsltRegularExpressions="urn:Exslt.ExsltRegularExpressions" xmlns:Exslt.ExsltStrings="urn:Exslt.ExsltStrings" xmlns:Exslt.ExsltSets="urn:Exslt.ExsltSets"
  exclude-result-prefixes="msxml
 umbraco.library Exslt.ExsltCommon Exslt.ExsltDatesAndTimes 
Exslt.ExsltMath Exslt.ExsltRegularExpressions Exslt.ExsltStrings 
Exslt.ExsltSets ">

<xsl:output method="xml" omit-xml-declaration="yes"/>
<xsl:param name="maxLevel" select="/macro/maxLevel"/>  
<xsl:param name="currentPage"/>
    
<xsl:variable name="FF_sortType" select="umbraco.library:RequestForm('sortType')" />   

<xsl:variable name="documentTypeAlias" select="string('Video')"/>

<xsl:template match="/">

<!-- The fun starts here -->
  <xsl:variable name="level">
    <xsl:choose>
        <xsl:when test="$maxLevel != ''"><xsl:value-of select="$maxLevel" /></xsl:when>
      <xsl:otherwise>6</xsl:otherwise>
    </xsl:choose>
  </xsl:variable>
  
      <div id="video_list_container">
        <ul>
          <xsl:for-each select="$currentPage/ancestor-or-self::root//* [name() = $documentTypeAlias and string(umbracoNaviHide) != '1']">
            <li>
              <div class="info">
                <h1>
                  <xsl:value-of select="@nodeName"/>
                </h1>
                <p>
                  <xsl:value-of select="umbraco.library:StripHtml(./videoDescription)" />
                </p>
              </div>
              <a href="http://www.youtube.com/apiplayer?video_id={video}&amp;version=3&amp;enablejsapi=1&amp;playerapiid=ytplayer&amp;autoplay=1"
 id="{video}" class="videoEmbedFancy" onclick="openFancyBoxVideo(this, {videoWidth}, {videoHeight});return false;" title="{@nodeName}">
                <img width="150" height="113" title="{@nodeName}" src="http://i.ytimg.com/vi/{video}/hqdefault.jpg" />
                <span>&nbsp;</span>
                </a>
            </li>
          </xsl:for-each>
        </ul>
      </div>

</xsl:template>

</xsl:stylesheet>