Open manuelnaturalcycles opened 7 years ago
On what iOS version does this happen?
Does it go fullscreen automatically? On autoplay?
Sorry if I was not clear, that is correct: Video tag with autoplay attribute goes fullscreen automatically.
I reproduce this in Xcode simulator iOS 8.4 / iPhone 5.
It looks like the same issue as https://github.com/bfred-it/iphone-inline-video/issues/59#issuecomment-232718210
I might have to document this issue but it only seems to happen with these big frameworks (Angular/Meteor) and I don't really have time to figure out why. Here's your workaround, in case anyone else needs it:
If autoplay
triggers an automatic fullscreen, remove the attribute and then play the video manually:
var video = document.querySelector('video');
if (makeVideoPlayableInline.isWhitelisted) { // only remove the attribute on iPhones
video.removeAttribute('autoplay');
makeVideoPlayableInline(video);
video.play();
}
The pause button can not show when playing inline. @fregante
Hello, I love this polyfill, we will use it in production! So many thanks for the work put on this.
The only problem that I have is this:
<video class="introPage-backVideo introPage-fadeable" ng-class="{'introPage-fadedOut': vm.playingOnboarding}" src="videos/loop.mp4" autoplay muted loop playsinline></video>
$backVideo = $('.introPage-backVideo')
backVideoDOMElement = $backVideo.get(0) as HTMLMediaElement
window.makeVideoPlayableInline(backVideoDOMElement, false)
in this case the video still goes automatically to full-screen typical native video behavior in ios8 and 9
if i remove the
autoplay
and instead use:$backVideo = $('.introPage-backVideo')
backVideoDOMElement = $backVideo.get(0) as HTMLMediaElement
window.makeVideoPlayableInline(backVideoDOMElement, false)
backVideoDOMElement.play()
it works like a charm.
so somehow 'autoplay' as html attribute has to be replaced by '.play()' on dom element.
Any clues?