Why is Autoplay video not working on iphone - iphone

Hi,
I have this video embedded onto my index
<video style="width:100%;" muted="" autoplay="">
<source src="video.webm" type="video/webm">
<source src="video.mov" type="video/mp4" codecs="hvc1">
</video>
it starts playing automatically on desktops and android phones, even ipads but not iphone for some reason. Why is that? Is the iphone browser blocking it or something?
Thank you.

Related

WebM video doesn't play on Safari browser IOS iPhone

<video autoPlay={true} loop={true} controls={false} muted playsinline id="video">
<source src={`${...}`} type="video/webm"></source>
</video>
I tried usng playsinline but didn't work.

Cannot open embedded mov file in Safari

I want to play an embedded .mov video in Safari on an iPad.
<video id="sampleMovie" width="640" height="360" preload controls>
<source src="1.mov" type="video/mov">
</video>
If I test that code in Chrome using my desktop, it will works perfectly.
Using iPad and iPhone, it won't play it at all.
Please change file extension from .mov to .mp4 and you can add its embedded movie file. Therefore, you can play the movie file.

Html5 video tag is not working on iPad

Using PhoneGap, I'm trying to display videos on a page.
All video tags are showing the play icon, but when I click on it, it does not play the video. This issue shows up only on iPad, not on iPhone.
Here's the markup I'm using:
<video id="video1" width="100" height="100" controls>
<source src="video1.mp4" type="video/mp4"/>
</video>
I can also recommend Projekktor jquery plugin.
check it at: http://www.projekktor.com/
I solved this by using JavaScript to enable the videos to run fullscreen.
It now runs fine on iPad and iPhone, here's a link to a question that helped me figure it out.

HTML5 Audio - Detecting a click on iPad/iPhone, iOS 7

I cannot get an audio tag to detect a click when it is running in iOS 7 (haven't tried earlier versions of the OS).
It works fine in a browser. Here is my code:
<audio id="myAudioPlayer" controls>
<source src="audio/myTrack.ogg" type="audio/ogg">
<source src="audio/myTrack.mp3" type="audio/mpeg">
<source src="audio/myTrack.acc" type="audio/acc">
Your browser does not support the audio tag. </audio>
Jquery:
$("#myAudioPlayer").mouseup(function(){
// DO STUFF
});
iOS 7 uses it's own styling for the HTML5 player so I am wondering if this is the issue? I can use the player controls as normal, but my custom functions do not work.
I couldn't find a fix for this so I ended up building a custom player with SoundManager2.
http://www.schillmania.com/projects/soundmanager2/
This allowed more control over my play/pause buttons and worked on iOS devices.

How to play a video inside mobile safari

I'm using a simple HTML5 video tag to reproduce an mp4 video in the iphone browser but it always open the video player on the iphone.
Is there a way to play the video inside the browser?
<video src="http://video-js.zencoder.com/oceans-clip.mp4"
autoplay="autoplay" <!-- Boolean attribute. Omit to prevent autoplay. -->
start="00:00:00.00"
loopstart="00:00:00.07" <!-- 7 seconds -->
loopend="00:00:00.19"
end="00:00:00.27"
playcount="4" <!-- play 4x -->
controls="true"
width="640"
height="480"
>
This is my code I'm using, and works well in a normal browser but in the iphone it allways opens in the video player.
Thanks!
To the best of my knowledge, iPhones always open HTML5 video in the native player (to avoid postage-stamp sized videos). iPads will play it within Safari using the same code. I don't believe there's a way to override this.
Use playsinline
<video … playsinline />