Nathaniel Harman
Nathaniel Harman

Reputation: 347

Video.js on Android? Does it work?

Spent way too much time on this now, has anyone got video.js working on android?

I can't!! works fine on ios and browsers

code,

<video id="example_video_1" class="video-js vjs-default-skin"
  controls preload="auto" width="300" height="200"
  poster="http://video-js.zencoder.com/oceans-clip.png"
  data-setup='{"controls": true, "autoplay": false, "preload": "auto"}'>
 <source src="http://www.machupicchumobile.com/onlineApps/android/CPAforNewbies/1.mp4" type='video/mp4' />
 <source src="http://www.machupicchumobile.com/onlineApps/android/CPAforNewbies/01CPANewbies_Intro_x264_1.webm" type='video/webm' />
 <source src="http://www.machupicchumobile.com/onlineApps/android/CPAforNewbies/01CPANewbies_Intro_x264_1.ogv" type='video/ogg' />

</video>

Upvotes: 4

Views: 15790

Answers (3)

Abhijeet
Abhijeet

Reputation: 8771

Yes, Video.js works perfectly on Android devices both on Web Browsers as well as on Hybrid Apps(Cordova). Was running through tests across devices(samsung,sony) and android versions for playing locally stored video(.mp4) file, found it working perfectly on Android 4.0.4+ onwards.

For Web Browsers testing used this link It also has source code incase you want to use it.

Note: For local files make sure you have correct path for video files as they differ on earlier versions of Android.

Upvotes: 0

mitchiru
mitchiru

Reputation: 199

I removed embedded video playing in Android completely by running this script before the initiation of video-js. It just links to the video file, so it will be played by a native video player.

if (navigator.userAgent.match(/Android/i) != null || (navigator.userAgent.match(/Chrome/i) != null && navigator.userAgent.match(/Mobile/i) != null)) {
    $('video').each(function() {
        var src = $(this).find('source[type="video/webm"]').attr('src');
        var poster = $(this).attr('poster');
        $(this).replaceWith('<div class="not-video-js"><a href="'+src+'" style="display:block; position: relative; top:0; left:0;"><img src="'+poster+'" class="posterframe-fake"></a><div class="not-video-js-button" tabindex="0" style="position:absolute; top:50%; left: 50%;"><span style="margin: -50px 0 0 -50px; position:absolute; top:50%; left: 50%;"><a href="'+src+'"><img src="img/btn_video_play.png"></a></span></div></div>');
    });
}

Upvotes: 0

misterben
misterben

Reputation: 7821

Video.js works fine on Android - but because the video.js controls are now disabled on mobile by default it's less obvious that it's working if you're not using the API.

Upvotes: 2

Related Questions