html5 видео через ротацию не показывать иконку AirPlay в контрольной

Question

Согласно Apple, вы должны быть в состоянии потока нормального html5 видео через ротацию

https://developer.apple.com/library/ios/releasenotes/General/WhatsNewInSafari/Articles/Safari_9.html#//apple_ref/doc/uid/TP40014305-CH9-SW5

Когда я пытаюсь использовать это от сафари на Iphone он выиграл» т показать значок AirPlay

<video src="http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4" x-webkit-airplay="allow" controls></video> 

Я также попытался это

<video src="http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4" controls></video> 

Я что-то упустил?

Answer 1

Ну попробуйте это:

<video controls id="video" x-webkit-airplay="allow" width="720"> 
    <source src="movie.mp4" type="video/mp4">  
</video> 

Важно: IOS 8+ имеют ротацию в центре управления. не видео

---

Если это не сработает, мы можем вызвать функцию AirPlay с помощью Javascript.

HTML:

<video controls id="video" x-webkit-airplay="allow" width="720"> 
    <source src="movie.mp4" type="video/mp4">  
</video> 
<button type="button" id="airplay"><i class="fa fa-apple fa-lg">Airplay</i></button> 

Javascript:

var video = document.getElementById('video'); 
var airPlay = document.getElementById('airplay'); 

// Airplay 
if (window.WebKitPlaybackTargetAvailabilityEvent) { 
    video.addEventListener('webkitplaybacktargetavailabilitychanged', function(event) { 
     switch (event.availability) { 
      case "available": 
       airPlay.style.display = 'block'; 
       break; 
      default: 
       airPlay.style.display = 'none'; 
     } 
     airPlay.addEventListener('click', function() { 
      video.webkitShowPlaybackTargetPicker(); 
     }); 
    }); 
}else { 
    airPlay.style.display = 'none'; 
} 

ПРИМЕЧАНИЕ: Помните HTML5 Airplay работать только в Safari 9+