Saltar al contenido

Video HTML5 // Ocultar completamente los controles

Después de de una extensa recopilación de información resolvimos esta contratiempo que tienen algunos los usuarios. Te brindamos la respuesta y nuestro objetivo es servirte de gran apoyo.

Solución:

Como esto:


controls es un booleano attribute:

Nota: Los valores “true” y “false” no están permitidos en booleanos
attributes. para representar un false valor, el attribute tiene que ser omitido por completo.

Puede ocultar controles usando CSS Pseudo Selectors como Demo: https://jsfiddle.net/g1rsasa3

//For Firefox we have to handle it in JavaScript 
var vids = $("video"); 
$.each(vids, function()
       this.controls = false; 
); 
//Loop though all Video tags and set Controls as false

$("video").click(function() 
  //console.log(this); 
  if (this.paused) 
    this.play();
   else 
    this.pause();
  
);
video::-webkit-media-controls 
  display: none;


/* Could Use thise as well for Individual Controls */
video::-webkit-media-controls-play-button 

video::-webkit-media-controls-volume-slider 

video::-webkit-media-controls-mute-button 

video::-webkit-media-controls-timeline 

video::-webkit-media-controls-current-time-display 



Una solución simple es simplemente ignorar las interacciones del usuario 🙂

video 
  pointer-events: none;

Reseñas y puntuaciones

Si haces scroll puedes encontrar las notas de otros desarrolladores, tú asimismo tienes la opción de insertar el tuyo si te apetece.

¡Haz clic para puntuar esta entrada!
(Votos: 2 Promedio: 3.5)


Tags : / /

Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *