Reputation: 1429
I have fullscreen video background, here is my code:
<div id="video-container">
<video id="video" autoplay loop>
<source src="ocean.mp4" type="video/mp4">
<source src="ocean.ogv" type="video/ogg">
<source src="ocean.webm" type="video/webm">
</video>
</div>
how you see it has autoplay attrubute, but on IPAD, IPHONE,etc.. it doesn't work untill you click on play button, but when I add poster attribute for poster image it works:
<video id="video" poster="poster.jpg" autoplay loop>
But I don't want with poster. Also I tried to use this js code but no result:
function startVideo(){
var myVideo = document.getElementById('video');
if ((myVideo.playing) || (myVideo.currentTime > 0)) {
// video is already playing
} else {
myVideo.play();
}
}
window.document.body.onload = startVideo;
Upvotes: 0
Views: 854
Reputation: 14128
I guess auto-play feature is not supported in iOS. Check this Apple documentation:
User Control of Downloads Over Cellular Networks
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 autoplay are disabled.
Here is the documentation link
Upvotes: 2