Posted By

bassdas on 01/22/11

Tagged

video
html5

Versions (?)

Last Edited at 01/22/11 01:22am

Statistics

Viewed 881 times

Favorited by 1 user(s)

Related snippets

HTML5 Embedded Crossbrowser Video

/ Published in: HTML

Expand | Embed | Plain Text

Copy this code and paste it in your HTML

<!-- 1) without Video Poster Image : -->
<video id='promovideo' class='video' width='640' height='480' controls='controls' preload='load' autoplay='autoplay' loop='loop'>
<!-- 2) Video Poster Image doesnt works with IOS3.0, but if its needed: -->
<video poster='image.jpg' id='promovideo' class='video' width='640' height='480' controls='controls' preload='load' autoplay='autoplay' loop='loop'>
 
  <source src='video.mp4' type='video/mp4' />
  <source src='video.webm' type='video/webm' />
  <source src='video.ogv' type='video/ogg' />
 
  <!-- Flash Fallback. Use any flash video player here. -->
  <object class='flash-fallback' width='640' height='480' type='application/x-shockwave-flash' data='http://releases.flowplayer.org/swf/flowplayer-3.2.1.swf'>
    <param name='movie' value='http://releases.flowplayer.org/swf/flowplayer-3.2.1.swf' />
    <param name='allowfullscreen' value='true' />
    <param name='wmode' value='transparent' />	
    <param name='loop' value='true' />
    <param name='flashvars' value="config={'playlist':[{'url': 'http://www.domain.ch/video.mp4','autoPlay':false,'autoBuffering':true}]}" />
    <!-- Image Fallback. Typically the same as the poster image. -->
    <img src='image.jpg' width='640' height='480' alt='video' title='No video playback capabilities.' />
  </object>
</video>