Auto play html5 video on mobile browser - html

It is argued that html5 video cannot be automatically payed in mobile browsers.
However, I found this website autoplaying video (though not looping it) on mobile:
http://campaign.nissan.co.il/qashqai0515
How is this possible?

Autoplay does not work on all versions of iOS and modern versions of Android. Both platforms require the user to click the video or a play button to initiate video play. It was made this way to conserve the devices battery life and limit cellular bandwidth.
There have been some workarounds in the past that use javascript to trigger the play event however from my testing those workarounds no longer work. Another trick is showing a sequence of images that looks like a video - Apple has done this in the past.
Note: I tested the link you provided in iOS 8 and it does not autoplay.

Related

Only one video is playing simultaneously on Safari (Mac)

I used Simple Peer(WebRTC), ReactJS for my video call service. In the video call screen, I used 2 video tags(contact video and user video) for video playback. When the call gets started after a successful connection, only the contact video is getting played(1st video tag) and when the contact turns off their video user video is getting played(2nd video tag).
This only happens on Safari(I only tested on Mac). It works fine in other browsers(Google Chrome, Firefox).
Is there a way to fix this issue?
WebRTC depends a lot on browsers and Safari has specific requirements (like strict order of tracks). Check JS console to identify any errors.
You can experiment with a turnkey html5 videocall solution that works and try to replicate.

HTML5 Video autoplay Not working in iPhone and Android?

I created a website for preview of HTML5 video autoplay, but it is not working on iPhone and Android 4+. Can anyone please let me know how can i make it work?
As of iOS 6.1, it is no longer possible to auto-play videos on the iPad.
My assumption as to why they've disabled the auto-play feature?
Well, as many device owners have data usage/bandwidth limits on their devices, I think Apple felt that the user themselves should decide when they initiate bandwidth usage.
After a bit of research I found the following extract in the Apple documentation in regard to auto-play on iOS devices to confirm my assumption:
"Apple has made the decision to disable the automatic playing of video on iOS devices, through both script and attribute implementations.
In Safari, on iOS (for all devices, including iPad), where the user may be on a cellular network and be charged per data unit, preload and auto-play are disabled. No data is loaded until the user initiates it." - Apple documentation.
Here is a separate warning featured on the Safari HTML5 Reference page about why embedded media cannot be played in Safari on iOS:
Warning: To prevent unsolicited downloads over cellular networks at the user’s expense, embedded media cannot be played automatically in Safari on iOS—the user always initiates playback. A controller is automatically supplied on iPhone or iPod touch once playback in initiated, but for iPad you must either set the controls attribute or provide a controller using JavaScript.
What this means (in terms of code) is that Javascript's play() and load() methods are inactive until the user initiates playback, unless the play() or load() method is triggered by user action (e.g. a click event).
Basically, a user-initiated play button works, but an onLoad="play()" event does not.
For example, this would play the movie:
<input type="button" value="Play" onclick="document.myMovie.play()">
Whereas the following would do nothing on iOS:
<body onload="document.myMovie.play()">
Source taken from :
Can you autoplay HTML5 videos on the iPad?
but as for android,
here you go
http://www.broken-links.com/2010/07/08/making-html5-video-work-on-android-phones/

HTML5 Multi Track Sync Video Audio on IOS

I'm looking for a way to multitrack a video with a bunch of sounds.
IOS prevent multiple audio and video to play at the same time.
I found a way on IOS, to launch a sound and an audio by putting the video.play() command in a setTimout (500ms). But this don't works every time, and the medias are not sync. This is not code consistent and maybe apple will correct this on breach on next version of iOS
MediaGroup and MediaController seem supported on iOS but not work properly.
AudioTrack was implemented on some navigators and seem to be removed
What is the alternative?
I've already tried those:
//gingertech.net/2011/05/01/html5-multi-track-audio-or-video/
//blog.denivip.ru/index.php/2013/10/alternative-audio-tracks-in-html5-video/?lang=en
//ldki.blogspot.ca/2012/11/15-html5-video-player-sync-second-audio.html

Stunted Functionality of html5 <audio> tag in mobile browsers

While testing the HTML audio tag, I came across two problems with mobile browsers. First, the "autoplay" attribute does not always function, so that the user needs to touch the "start" button on the screen. Second, a 1:09 recording, cuts off at about one minute with some browsers, but plays to completion with others. An example of the first problem is that autoplay works as it should using the Google Chrome browser on my desktop, but not on my Android (HTC EVO) mobile phone. An example of the second problem is that the mobile Chrome browser plays the audio file to completion on my phone, but the default browser that came with my phone cuts off about 8 seconds prematurely. The autoplay feature, however, works as it should on the "default" browser.
Are these problems caused by reduced functionality and memory when going from a desk or laptop environment to a smartphone environment?
Don't know about Android, but iOS has well-known limitations on HTML5 audio and video. Apple claims they are designed to save data charges, even though they apply even when you are on WiFi, or the assets are local as in an e-book.
The limitations include no preloading until some user interaction occurs, no looping, no inline replay on iPhone, no change of playback rate, no playing backwards, no volume control, etc. etc. See http://blog.millermedeiros.com/unsolved-html5-video-issues-on-ios/ for a good summary.

How can i make a Flash-free, basic audio control?

I need to make a basic audio control: one audio file, play and pause buttons, no more.
I cannot use Flash at all - this website will only be used if the client does not have flash enabled.
HTML5 does not seem to be a good solution because my target clients (who do not enable Flash) most likely won't have modern browsers. Even worse, Safari does not seem to play the best solution available (jPlayer).
The lastest versions of all the main browsers (IE, Chrome, FF, Safari, Mobile Safari, Android) can play audio natively using the HTML5 audio element (so long as the media is encoded in a supported format).
IE6,7 and 8 can only play audio directly in the browser with the help of plugs-ins (e.g. Quicktime, Flash etc.).
So, if you have IE8 or less i'm afraid you cannot play audio directly in the browser without Flash or another plug-in.