Clever Geek Handbook

HTML html5 tag not working on android phone

I have created an app in android phonegap. I want to play video using html5 video player. My code:

<!DOCTYPE html>
<html>
    <head>
      <title>Video.js | HTML5 Video Player</title>
      <link href="http://vjs.zencdn.net/c/video-js.css" rel="stylesheet" type="text/css"> 
      <script src="http://vjs.zencdn.net/c/video.js"></script>
    </head>
    <body>
      <video id="example_video_1" class="video-js vjs-default-skin" controls preload="none" width="640" height="264" poster="http://video-js.zencoder.com/oceans-clip.png" data-setup='{"controls":true}'>
        <source src="http://video-js.zencoder.com/oceans-clip.mp4" type='video/mp4' />
        <source src="http://video-js.zencoder.com/oceans-clip.webm" type='video/webm' />
        <source src="http://video-js.zencoder.com/oceans-clip.ogv" type='video/ogg' />
      </video>
    </body>
</html>

This code shows the video player. but the video doesn't play when the play button is pressed. What mistake? please guide me. thanks in advance.

+3


source to share


6 answers


You said it didn't work on the emulator, right? Don't you think the video isn't playing mainly because you probably don't have hardware acceleration on the Android SDK emulator? Some things don't work as expected (sometimes don't work at all) unless you have HW acceleration and a device powerful enough for it.



If this is the case, the workaround is using 3GP video. This should work the Android SDK emulator as well on older Android mobiles with weak hardware. I used this on my project.

+1


source


When you use Video tag to play video in phonegap app, it works fine on iphone but not Android.



0


source


In addition to what ghostCoder says below (adding a video playback click handler you need to do for Android), also try uninstalling type='video/mp4'

as it confuses Android sometimes.

0


source


Add android: hardwareAccelerated = "true" as a child in the activity manifest file. It plays html5 videos inside webviews without any workarounds.

eg,

<activity
    android:name="com.example.MainActivity"
    android:hardwareAccelerated="true"
    android:configChanges="keyboardHidden|orientation|screenSize" >
    ...
</activity>
0


source


try something like this

var video = document.getElementById('video');
video.addEventListener('click',function(){
  video.play();
},false);
-1


source


Are you sure the video stream is "H.264" and the "AAC" audio stream for MP4. Because I assume Android MP4 support

-2


source






More articles:


All Articles