07-20-2013 05:06 PM
I am trying to build a webworks app that supports video playback for MP4 format (possibly with an FLV fallback). The video tag works flawlessly in the ripple emulator (on chrome).
On the device (both BB10 Z - Dev Alpha B and BB10 Q) the video poster appears, and on video playback the video disappears. The audio continues the play, but there is no visible video. On pressing the back button in the action bar, a few times the video reappears and plays properly.
The video disappears again when restarting to seeking to the beginning of the video.
This does not seem to be linked to any specific video as I have tried videos hosted on several different servers.
The simplest version of the code looks something like this:
var video = document.createElement('video');
video.controls = true;
Is there another / better way of achieving video playback?
Solved! Go to Solution.
07-22-2013 04:13 PM
Have you tried using a local .mp4 file bundled with the application? Not sure if you are aware, but the video url you provided does not work in Chrome either.
Grab the big buck bunny video file from here: http://www.bigbuckbunny.org/index.php/download/
Bundle with app, and reference as video.src="relative_path_to_video.mp4" and let us know how it behaves.
07-22-2013 04:28 PM
Thanks for your response. The url works for me in chrome, just checked it.
Anyways, I figured out the issue using web inspector. The video tries to go fullscreen when played and hides behind the page. I've set it to play inline for now using "webkit-playsinline" on the video tag.
I think it's just some CSS (I suspect z-index of the bb-screen), but I'll get to it later.