Al utilizar el reproductor de incrustación iframe de YouTube, ¿hay alguna forma de activar la pantalla completa programáticamente? Quiero eliminar los controles predeterminados (usando controles = 0) pero luego tengo la capacidad de crear un botón de pantalla completa personalizado por sí mismo.Reproductor de iframe de YouTube: activar pantalla completa en iOS
Respuesta
Hacer el iframe no pantalla completa, pero FullPage:
function fullscreen() {
var vid = document.getElementById("vid");
vid.style.position = "absolute";
vid.style.width = "100vw";
vid.style.height = "100vh";
vid.style.top = "0px";
vid.style.left = "0px";
document.getElementById("exit").style.display = "inline";
}
function exitfullscreen() {
var vid = document.getElementById("vid");
vid.style.position = "";
vid.style.width = "";
vid.style.height = "";
vid.style.top = "";
vid.style.left = "";
document.getElementById("exit").style.display = "none";
}
<iframe width="560" height="315" src="https://www.youtube.com/embed/fq6qcvfZldE?rel=0&controls=0&showinfo=0" frameborder="0" id="vid" allowfullscreen></iframe>
<button onClick="fullscreen()">Fullscreen</button>
<button style="position: fixed;
bottom: 5px;
right: 5px;
display: none;
z-index: 2000;" id="exit" onClick="exitfullscreen()">Exit Fullscreen</button>
El página completa botón en la esquina superior derecha del fragmento de código también funciona de esta manera. Si quieres hacer que el navegador sea de pantalla completa, puedes probar document.requestFullscreen();
, pero esto sigue siendo experimental y funciona en muy pocos navegadores. Eche un vistazo al tema MDN de esta función.
EDITAR: Acabo de encontrar esto: https://developers.google.com/youtube/?csw=1#player_apis, la API oficial de jugador de youtube.
intente lo siguiente en los navegadores WebKit:
if (typeof iframe.webkitRequestFullScreen === 'function') {
button.addEventListener('click', function() {
iframe.webkitRequestFullScreen();
}, false);
}
Tenga en cuenta que esto no funcionará sin un gesto de usuario (en este caso, 'clic').
Puede usar esta biblioteca XCDYouTubeKit en lugar de iframe player.
Es muy simple y potente. Admite pantalla completa y no a pantalla completa.
- 1. Pantalla completa Iframe
- 2. "pantalla completa" <iframe>
- 3. iOS - Force pantalla completa video
- 4. MPMoviePlayerController no reproduce películas en pantalla completa
- 5. ios: colorWithPatternImage, expandir la imagen de pantalla completa
- 6. MPmoviePlayerController quirk de pantalla completa en el iPad
- 7. Widget de pantalla completa
- 8. Cómo hacer pantalla completa en Android 4.0
- 9. Superposición de MPMoviePlayer en modo de pantalla completa (iPad)
- 10. Reproductor de video receptivo
- 11. pantalla completa API HTML5 y Safari (IOS 6)
- 12. iOS a pantalla completa ¿La aplicación web arroja cookies?
- 13. Mantenga la API de pantalla completa en pantalla completa después de hacer clic en un vínculo
- 14. UINavigationController no de pantalla completa
- 15. Pasar de la pantalla completa a la pantalla completa pop/slide
- 16. Forzar pantalla completa en Chrome
- 17. Soundcloud iframe dejado de funcionar en iOS
- 18. [Pantalla de bienvenida] ¿Cómo mostrar una imagen en pantalla completa?
- 19. Safari Mobile pantalla completa
- 20. Pantalla completa Google Map
- 21. Pantalla completa con pyqt4?
- 22. Pantalla completa C# Aplicación
- 23. Reproductor de video HTML5: cargar videos dinámicamente
- 24. Activar programáticamente la pantalla en android
- 25. Agregar un MPMoviePlayerController en modo de pantalla completa?
- 26. Imagen de pantalla completa de iPhone
- 27. Modo de pantalla completa de Internet Explorer?
- 28. iframe en iOS (iPad), problema de recorte de contenido
- 29. Java Windows 8 Pantalla completa?
- 30. minimizar pantalla completa OpenGL Window
Puede probar y examinar las vistas secundarias UIWebView para una clase AVPlayer, y poner su capa a pantalla completa – atrebbi