html5 vidéo android: conserve le format d'image en plein écran

Question

J'utilise la balise vidéo pour diffuser hls dans les appareils iPad et Android.
J'ai un problème avec Android: après avoir passé en mode plein écran, la vidéo s'étire pour remplir l'écran de l'appareil, ce qui casse le format d'origine.

Il va dans le bon sens après avoir tourné.

Voici un exemple de code que j'utilise, bien que ce soit hls, je crois que le même problème existe aussi avec les fichiers vidéo normaux.

<video id="main-video" src="my_hls_link.m3u8" style="width:100%; height:270px;"> 
</video> 

Et javascript:

var player = document.getElementById("main-video"); 
player.addEventListener('webkitbeginfullscreen', function(){ 
      this.load(); 
      this.play(); 
      }, false); 

testé à l'aide de chrome dans Nexus 7 Android 4.1 et KindleFire Android 4.0

Answer 1

Je peux juste faire un travail autour avec ceci:

//fixing the bug in android that stretch video on load 
     function fix_stretch_video(){ 
     var check_interval = setInterval(function(){ 
      $('.pl-loading-btn').css('display', 'block'); 
      if (player.videoWidth != 0) { 
      $('.pl-loading-btn').css('display', 'none'); 
      $('video').css('width', '99%'); 
      $('video').css('width', '100%'); 
      clearInterval(check_interval); 
      } 
     },100); 
     } 

ne fonctionne pas dans un appareil (ou version Android) tu. Au moins c'est le travail sur mon nexus 7