embed youtube using valid xhtml causes problem

[D. Shun-Luoi Fong]

I am using fancybox and everything is working great except one issue
in IE7. I am trying to use fancybox to show embedded YouTube videos.
Following the advice at this article (http://www.sohtanaka.com/web-
design/valid-xhtml-youtube-embed-code/) I changed the code from
YouTube to only use the object tag, but not the embed tag. It works
just fine, in fancybox, in FF, Safari, Opera, and Flock, but in IE7 it
only show a blank white screen when the fancybox overlay comes up.

Is there something in the fancybox code that would cause this problem
in IE7?

You can see a live example at http://www.worldviewresources.com/watch/.
If you click on the link, "Watch the video" for the post, "Art and
Theology: An Interview with Dr. Reg Grant, Part 1" you should be able
to watch the video (in IE7) because I did not remove the "embed" tag
from the code. However, if you click on the "Watch the video" links
for any of the other posts then it should not work b/c I removed the
"embed" tag from the Youtube code.

Any thoughts or ideas for a solution?

[D. Shun-Luoi Fong]

bump. anyone have any insight on this one?

On May 6, 9:40 am, "D. Shun-Luoi Fong" <dsf...@gmail.com> wrote:
> I am using fancybox and everything is working great except one issue
> in IE7. I am trying to use fancybox to show embedded YouTube videos.
> Following the advice at this article (http://www.sohtanaka.com/web-
> design/valid-xhtml-youtube-embed-code/) I changed the code from
> YouTube to only use the object tag, but not the embed tag. It works
> just fine, in fancybox, in FF, Safari, Opera, and Flock, but in IE7 it
> only show a blank white screen when the fancybox overlay comes up.
>
> Is there something in the fancybox code that would cause this problem
> in IE7?
>

> You can see a live example athttp://www.worldviewresources.com/watch/.

[JFK]

to display a flash video without the <embed> tag and therefore to have
a valid html markup, you would use the object tag as described at
http://www.sohtanaka.com/web-design/valid-xhtml-youtube-embed-code/:

<object class="flashvideo" type="application/x-shockwave-flash"
data="http://www.yout.......etc

It was reported that this method doesn't work in IE7 (and IE6) if
displaying the video in a fancybox (inline content)
I found out that if you remove the data attribute from the object tag,
then IE will display the video (in a fancybox) but not firefox and the
rest of the standard browsers:
<object class="flashvideo" type="application/x-shockwave-flash" >

so targeting IE with conditional comments is needed:
<div id="youtube" style="display: none;">
<!-- Downlevel-revealed Conditional Comments -->
<!-- http://reference.sitepoint.com/css/conditionalcomments -->

<!-- for all browsers -->
<!--[if !IE]>-->
<object class="flashvideo" type="application/x-shockwave-flash"
data="http://www.youtube-nocookie.com/v/GfiuwH9l96g">
<!--<![endif]-->

<!-- for IE only, all versions -->
<!--[if IE]><!-->
<object class="flashvideo" type="application/x-shockwave-flash" >
<!--<![endif]-->

<param name="movie" value="http://www.youtube-nocookie.com/v/
GfiuwH9l96g" />
<param name="wmode" value="opaque"></param></param>
</object>
</div>