Advertisements

Embedded HTML5 video to play on ipad/iphone

Postby yandoo » Sun Apr 28, 2013 2:31 am

Offline
yandoo
Posts: 1
Joined: Sun Apr 28, 2013 2:23 am
Hiya I was hoping for some help please.

I've spent a while trying to embed a html5 video that works on androids, ff, ie chrome, safari (laptop) and iphones/ipads. So far it works on every thing except for iphones and ipads (because I have not tested it on ipad yet). I've even used a online iphone web browser emulator on my laptop and it works but NOT on an actual iphone. I just don't understand why its not working on the iphone. I've been through so many forums, tutorials and guides and cant see anything wrong with my code. Heres what I have:

Code: Select all
<script>
function vidEvent() {
   var videos = document.getElementsByTagName('video');
   var vidCount = videos.length;
   for(i=0;i<vidCount;i++) {
      videos[i].addEventListener('click',bang,false);
   }
}
function bang() { this.play(); }
window.onload = vidEvent;
</script>


<div id="VArea" style="border:1px solid blue;">
<video width="560" height="320" preload autoplay>
<source src="videos/Landing-Page.mp4" type="video/mp4" />
<source src="videos/Landing-Page.ogv" type="video/ogg" />
<object type="application/x-shockwave-flash" data="http://releases.flowplayer.org/swf/flowplayer-3.2.1.swf" width="640" height="360">
<param name="movie" value="http://releases.flowplayer.org/swf/flowplayer-3.2.1.swf" />
<param name="wmode" value="transparent" />
<param name="bgcolor" value="#FFFFFF" />
<param name="quality" value="high" />
<param name="allowFullScreen" value="true" />
<param name="allowscriptaccess" value="always" />
<a href="http://www.adobe.com/go/getflash">
<img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" />
</a>
<param name="flashvars" value="vdo=videos/Landing-Page.flv&amp;autoplay=true" />
<!--[if !IE]>-->
</object>
<!--<![endif]-->
</object>
</video>
  </div>



The JS is needed to call the video for android devices. Any ideas on how I can get it to work on iphones please?

Thank you