CODEWITHSUNDEEP
javascriptjqueryhtml
Rijo
Rijo

Reputation: 3043

HTML5 Video is not loading in mobile device why?

Code shown below 

<video poster="http://mediamoments.in/images/Logo-PNG-bkg.png" id="bgvid" playsinline autoplay muted>
    <source src="http://www.mediamoments.in/vid/MM_Logo_Identity.mp4" type="video/mp4" id="bgvid1">
    </video>

Script 

document.getElementById('bgvid').addEventListener('ended',myHandler,false);
function myHandler(e) {
    console.log('ended');
    setTimeout(function(){
        document.getElementById('bgvid').play();
    }, 1000);
};

https://jsfiddle.net/rijo/stfcf8ny/6/

Upvotes: 1

Views: 349

Answers (2)

Hevar
Hevar

Reputation: 1529

Depending on what device you want to play the video on you have might have to specify the format for it. This is due to that different browsers support different formats.

To do so add multiple format references (mp4, webm, ogg etc.).

You can use this: caniuse to see the browser support for different formats.

Android https://developer.android.com/guide/topics/media/media-formats.html

Ios https://developer.apple.com/library/content/documentation/Miscellaneous/Conceptual/iPhoneOSTechOverview/iPhoneOSTechnologies/iPhoneOSTechnologies.html

Upvotes: 2

Mark Redman
Mark Redman

Reputation: 24515

To cater for all devices, we usually reference the .mp4, .ogg and .webm files, each browser/device can support different formats.

Upvotes: 0

Related Questions