CODEWITHSUNDEEP
javascripthtmlmobilehtml5-videoautoplay
Azeem Haider
Azeem Haider

Reputation: 111

Autoplay video in Mobile device

I want to play video and audio in autoplay mode, When both are ready to play.
I'm using this code. 

 var video = false;
 var audio = false;
 video.addEventListener('canplay',function(){
    video = true;
    playall();
 });
 audio.addEventListener('canplay',function(){
    audio = true;
    playall();
 });
playall(){
  if(video && audio){
    console.log('playing start....');
    video.play();
    audio.play();
  }
}

This code is working fine in desktop browsers. But when I try it on mobile device it is not working. Here is a link where you can see it live how its working.
Video Link

Upvotes: 2

Views: 7154

Answers (3)

mialdi98
mialdi98

Reputation: 73

Right now answering by only adding autoplay muted to the video tag isn't working.

For me, the easiest solution was to use the native function play().

<video>
    <source src="video.mp4" type="video/mp4">
    Your browser does not support HTML5 video.
</video>

for the code above use this js (if browser is really old use if statement below):

var video = document.querySelector('video');
if ('play' in video) {
    video.play();
}

Upvotes: 0

saad
saad

Reputation: 1364

Chrome/ie now supports the autoplay if muted

<video id="video" width="100%" controls   autoplay muted>
    <source src="<Your video src>" type="video/mp4">
    Your browser does not support HTML5 video.
</video>

Upvotes: 1

Al D
Al D

Reputation: 13

Apparently, you can't for now as stated here :

The auto play limitation in mobile browsers is an intentional limitation put in by the OS developers. To my knowledge, there is absolutely no way to auto play content in a mobile browser because the event that is required to trigger content play is an OS/Phone event, one which the browser itself has no control over or interaction with.

HTML5 Video autoplay on Mobile Browser

Upvotes: 0

Related Questions