HTML5 video not working on mobile phone -


i'm trying html5 video working on web. on desktop works doesn't happen same mobile phone. instead, appears typical video-like image show it's supposed video there wasn't loaded. used easyhtml5video convert video several different formats , according sw, should compatible lots of platforms... after conversion, gives code use, modified adapt paths , style.

my mobile phone uses android 4.0.

html

<video id="video-background" preload="auto" autoplay="autoplay" poster="./images/starry_sky.jpg" loop="loop">     <source src="./videos/time_lapse.m4v" type="video/mp4" />     <source src="./videos/time_lapse.webm" type="video/webm" />     <source src="./videos/time_lapse.ogv" type="video/ogg" />     <source src="./videos/time_lapse.mp4" />     <object type="application/x-shockwave-flash" data="./videos/flashfox.swf">         <param name="movie" value="./videos/flashfox.swf" />         <param name="allowfullscreen" value="false" />         <param name="flashvars" value="autoplay=true&controls=false&fullscreenenabled=false&posteronend=false&loop=true&poster=./images/starry_sky.jpg&src=time_lapse.m4v" />         <embed src="./videos/flashfox.swf" flashvars="autoplay=true&controls=false&fullscreenenabled=false&posteronend=false&loop=true&poster=./images/starry_sky.jpg&src=./videos/time_lapse.m4v"  allowfullscreen="false" wmode="transparent" type="application/x-shockwave-flash" pluginspage="http://www.adobe.com/go/getflashplayer_en" />         <img alt="time_lapse" src="./images/starry_sky.jpg"/>     </object> </video> 

edit

i've tried open default browser. when tried google chrome image inside object tag loaded still not video.

according this (rather old) post, might need add following javascript code make playback work on android:

function myonload() {   var ua = navigator.useragent;   if (typeof ua != “undefined” && ua.match(/android.* 2\.[0 – 2](\.[0 – 9]+)*[^.0 – 9]/i) !== null) {     var vid = document.getelementbyid(“video”);     vid.addeventlistener(“click”, function() {       vid.play();     }, false);   } } window.onload = myonload; 

also, according this question, may need write video tag this:

<video class="video" poster="/assets/video/posters/example.jpg" controls width="768" height="432" preload="none">   <source src="/assets/video/example.mp4" type='video/mp4; codecs="avc1.42e01e, mp4a.40.2"' />   <source src="/assets/video/example.ogv" type='video/ogg; codecs="theora, vorbis"' /> </video> 

Comments

Popular posts from this blog

c++ - Difference between pre and post decrement in recursive function argument -

php - Nothing but 'run(); ' when browsing to my local project, how do I fix this? -

php - How can I echo out this array? -