Html5 Lecteur vidéo: Les commandes personnalisées ne sont pas affichées en mode complet sur Android-phone

Question

J'ai créé mon lecteur pour la vidéo sur le site. J'ai utilisé la technologie Html5. Tout fonctionne bien sur le PC. Mais si j'ouvre mon lecteur sur Android-phone en mode complet, les commandes ne sont pas affichées. IMAGE

Pourquoi cela se produit-il? Je besoin d'aide :) Code Ouvrir mon lecteur CE: CODE PEN

Answer 1

La vidéo et les contrôles personnalisés doivent être dans ce container.Its pas la vidéo que vous prenez à la place fullscreen mais ses container.I espère que cela vous aide.

Code Html

<div id="videoContainer"> 
      <video>...<source></source> 
      </video> 
      <div> custom controls 
       <button>play/pause</button> 
       <button id="fullscreenBtn" class="enterFullscreenBtn">fullscreen</button> 
      </div> 
    </div> 

code Js

var video=$('video'); 
$('#fullscreenBtn').on('click', function() { 
if (video.requestFullscreen) 
{ 
    $("#videoContainer").webkitRequestFullScreen(); 
} 
});