test_yt


Above is the html code from page: http://camendesign.com/code/video_for_everybody/test_yt.html

<head>
    <meta charset="UTF-8" />
    <title>“Video For Everybody” YouTube Test Page</title>
    <style type="text/css">
        body        {width: 640px; margin: 0 auto 20px;
                 font: 11px "Helvetica Neue", Arial, sans-serif; color: #3b3d3c;}
        p        {text-align: justify;}

        table            {width: 100%; border-collapse: collapse;}
        thead th        {text-align: left;    padding: 5px;        border-bottom: 1px solid #3E4040;}
        tbody th        {text-align: right;    padding-right: 10px;     border-right: 1px solid #3E4040;}
        tbody th, tbody th+td    {white-space: nowrap;}
        td            {text-align: left;    padding: 5px;}
    </style>
</head>
<body>

<h1>“Video For Everybody” YouTube Test Page</h1>
<p>
    Please refer to the <a href="test.html">main test page</a> for details.

</p><p>
    This is a version of “<a href="/code/video_for_everybody">Video For Everybody</a>” using a YouTube video for the
    Flash fallback, rather than a locally hosted version. This should provide compatibility for devices that do not have
    Flash 9 + H.264 playback capabilities.
</p>

<!-- "Video For Everybody" by Kroc Camen. see <camendesign.com/code/video_for_everybody> for documented code
     =================================================================================================================== -->
<video width="640" height="360" poster="poster.jpg" controls autoplay>
    <source src="http://clips.vorwaerts-gmbh.de/big_buck_bunny.ogv" type="video/ogg"></source>
    <source src="http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4" type="video/mp4"></source>
    <!--[if gt IE 6]>
    <object width="640" height="375" classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B"><!
    [endif]--><!--[if !IE]><!-->
    <object width="640" height="375" type="video/quicktime" data="http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4">

    <!--<![endif]-->
    <param name="src" value="http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4" />
    <param name="autoplay" value="false" />
    <param name="showlogo" value="false" />
    <object width="640" height="505" type="application/x-shockwave-flash" data="http://www.youtube.com/v/YE7VzlLtp-4">
        <param name="movie" value="http://www.youtube.com/v/YE7VzlLtp-4" />
        <!-- fallback image -->
        <img src="poster.jpg" width="640" height="360" alt="Big Buck Bunny"
             title="No video playback capabilities, please download the video below" />
    </object><!--[if gt IE 6]><!-->

    </object><!--<![endif]-->
</video>
<p>    Download Video:
    <a href="http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4">Apple iTunes "MP4"</a> |
    <a href="http://clips.vorwaerts-gmbh.de/big_buck_bunny.ogv">Open Format "OGG"</a>
</p>

<h2>Table of Compatibility</h2>
<table><thead>
<tr>
    <th></th><th>Playback Used</th><th>Notes</th>

</tr>
</thead><tbody>
<tr>
    <th>Wii</th>
    <td>Flash</td>
    <td>Ensure you update your version of Internet Channel (Flash Lite 3.1)</td>
</tr><tr>
    <th>PS3</th>
    <td>NONE</td>

    <td>Just shows “Application not supported”</td>
</tr><tr>
    <th>PSP</th>
    <td>NONE</td>
    <td>Apparently nothing works, no fallback text <a href="http://twitter.com/daemonraccoon/status/2183432308">◊</a></td>
</tr>
</tbody></table>

</body>

Code for the above Meet iPad video:

[[html]]
<video width="640" height="360" poster="__POSTER__.JPG" controls>
    <source src="__VIDEO__.OGV" type="video/ogg"></source>
    <source src="http://www.youtube.com/get_video?fmt=18&video_id=nZ-yNISb54k&t=vjVQa1PpcFMKKyS-6V0J8DWiY83BN_AtjWouh8sjXKk%3D" type="video/mp4"></source><!--[if gt IE 6]>
    <object width="640" height="375" classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B"><!
    [endif]--><!--[if !IE]><!-->
    <object width="640" height="375" type="video/quicktime" data="http://www.youtube.com/get_video?fmt=18&video_id=nZ-yNISb54k&t=vjVQa1PpcFMKKyS-6V0J8DWiY83BN_AtjWouh8sjXKk%3D">
    <!--<![endif]-->
    <param name="src" value="http://www.youtube.com/get_video?fmt=18&video_id=nZ-yNISb54k&t=vjVQa1PpcFMKKyS-6V0J8DWiY83BN_AtjWouh8sjXKk%3D" />
    <param name="showlogo" value="false" />
    <param name="autoplay" value="false" />
    <object width="640" height="505" type="application/x-shockwave-flash" data="http://www.youtube.com/v/nZ-yNISb54k">
        <param name="movie" value="http://www.youtube.com/v/nZ-yNISb54k" />
             title="No video playback capabilities, please download the video below" />
    </object><!--[if gt IE 6]><!-->

    </object><!--<![endif]-->
</video>
[[/html]]
Unless otherwise stated, the content of this page is licensed under Creative Commons Attribution-ShareAlike 3.0 License