views:

40

answers:

2

I'm embedding youtube clips on my site with the following code:

<object width="259" height="215"  style="margin:auto; width:262px; height:217px; position:relative;">
    <param name="movie" value="http://www.youtube.com/v/&lt;?php echo $yt_id; ?>&hl=en&fs=1&rel=0&hl=en&fs=1&rel=0&showinfo=0&autoplay=1"></param>
    <param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param>
    <embed src="http://www.youtube.com/v/&lt;?php echo $yt_id; ?>&hl=en&fs=1&rel=0&hl=en&fs=1&rel=0&showinfo=0&autoplay=1" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="259" height="215"></embed>
</object>
<p style="margin-top:12px; width: 259px; text-align:center;"><?php echo $yt_title; ?></p>

which works great in html5 equipped or flash equipped browsers. However, if i try using IE 7/8 without flash installed, i get this placeholder:

alt text

how can i get a "this video requieres flash player" instead?


update: this is my final code using Richard JP Le Guen's solution. it works perfectly.

<object width="259" height="215"  style="margin:auto; width:262px; height:217px; position:relative;">
    <param name="movie" value="http://www.youtube.com/v/&lt;?php echo $yt_id; ?>&hl=en&fs=1&rel=0&hl=en&fs=1&rel=0&showinfo=0&autoplay=1" />
    <param name="wmode" value="opaque" />
    <!--[if !IE]>-->
        <object type="application/x-shockwave-flash" data="http://www.youtube.com/v/&lt;?php echo $yt_id; ?>&hl=en&fs=1&rel=0&hl=en&fs=1&rel=0&showinfo=0&autoplay=1" allowfullscreen="true" width="259" height="215">
            <param name="wmode" value="opaque" />
            <!--<![endif]-->
            <a href="http://www.adobe.com/go/getflashplayer" style="display: block; text-align:center; padding-top:40px;">
                <img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" />
            </a>
            <!--[if !IE]>-->
        </object>
    <!--<![endif]-->
</object>
+1  A: 

YouTube uses a <noembed> tag:

 <embed>blah</embed>
 <noembed>
    <div class="yt-alert yt-alert-error yt-alert-player yt-rounded">
      <img src="http://s.ytimg.com/yt/img/pixel-vfl73.gif" class="icon master-sprite" alt="Alert icon">
      <div class="yt-alert-content"> You need Adobe Flash Player to watch this video. <br> <a href="http://get.adobe.com/flashplayer/"&gt;Download it from Adobe.</a> 
      </div>
    </div>
  </noembed>

Although I do not think it belongs to any official standard...

Edit: Added <embed> tag to example, to show what YouTube is doing.

Veger
hmm i'm not sure how to implement that in my own site, shows as an additional object like the <embed> one
Haroldo
YouTube adds this tag directly after their `<embed>` tag. I suppose browser only show its contents if the `<embed>` tag failed? As I said I do not thing it is part of any official standard.
Veger
+2  A: 

This looks like the sort of thing one uses SWFObject for.

With SWFObject, you add the <object> and <embed> dynamically, using JavaScript. In your (normal, standards-compliant) HTML you would have a message like "You need Flash and JavaScript to view this video" and then use SWFObject to swap out that content for the video.

A quick Google search for SWFObject and YouTube yielded this article. I don't have time to read it, but it looks like it could help.

LeguRi
that artical worked a treat thanks for your help,will update the q with finished code..
Haroldo