El reproductor de vídeo es el área rectangular en la que se muestra el contenido de vídeo dentro del visor.
Si las dimensiones del vídeo que se está reproduciendo no coinciden con las dimensiones del reproductor, el contenido del vídeo se centra dentro del área de visualización rectangular del reproductor de vídeo.
El siguiente selector de clase CSS controla el aspecto del reproductor de vídeo:
.s7mixedmediaviewer .s7videoplayer
Propiedades CSS del reproductor de vídeo
background-color |
Color de fondo del reproductor de vídeo. |
El mensaje de error que se muestra si el sistema no puede reproducir el vídeo se puede localizar. Consulte Localización de los elementos de la interfaz de usuario para obtener más información.
Ejemplo: para hacer que el reproductor de vídeo sea transparente:
.s7mixedmediaviewer .s7videoplayer {
background-color: transparent;
}
Los subtítulos se colocan en un contenedor interno dentro del reproductor de vídeo. La posición de ese contenedor está controlada por los operadores de posición WebVTT admitidos. El texto del rótulo en sí está dentro de ese contenedor; su estilo se controla con el siguiente selector de clase CSS:
.s7mixedmediaviewer .s7videoplayer .s7caption
Propiedades CSS de los rótulos
CSS, propiedad |
Descripción |
---|---|
background-color |
Fondo de texto del rótulo. |
color |
Color del texto del rótulo. |
font-weight |
Grosor de fuente. |
font-size |
Tamaño de fuente. |
font-family |
Familia de fuentes. |
Ejemplo: para configurar el texto del rótulo para que sea gris claro de 14 píxeles Arial® en un fondo negro semitransparente:
.s7mixedmediaviewer .s7videoplayer .s7caption {
background-color: rgba(0,0,0,0.75);
color: #e6e6e6;
font-weight: normal;
font-size: 14px;
font-family: Arial,Helvetica,sans-serif;
}
El aspecto de la animación de almacenamiento en búfer se controla con el siguiente selector de clase CSS:
.s7mixedmediaviewer .s7videoplayer .s7waiticon
Propiedades CSS del icono de espera
CSS, propiedad |
Descripción |
---|---|
width |
Anchura del icono de animación. |
height |
Altura del icono de animación. |
margin-left |
Icono de animación margen izquierdo, normalmente menos la mitad de la anchura del icono. |
margin-top |
Margen superior del icono de animación, normalmente menos la mitad de la altura del icono. |
imagen de fondo |
Ilustración del botón. |
Ejemplo: para configurar una animación de almacenamiento en búfer para que tenga 101 píxeles de ancho, 29 píxeles de alto:
.s7mixedmediaviewer .s7videoplayer .s7waiticon {
width: 101px;
height: 29px;
margin-left: -50px;
margin-top: -15px;
background-image: url(images/sdk/busyicon.gif);
}