O reprodutor de vídeo é a área retangular na qual o conteúdo de vídeo é exibido no visualizador.
Se as dimensões do vídeo que está sendo reproduzido não corresponderem às dimensões do reprodutor de vídeo, o conteúdo do vídeo será centralizado na área de exibição do retângulo do reprodutor de vídeo.
O seguinte seletor de classe CSS controla a aparência do reprodutor de vídeo:
.s7mixedmediaviewer .s7videoplayer
Propriedades CSS do reprodutor de vídeo
cor do fundo |
A cor de fundo do reprodutor de vídeo. |
A mensagem de erro que é exibida se o sistema não conseguir reproduzir o vídeo pode ser localizada. Consulte Localização dos elementos da interface do usuário para obter mais informações.
Exemplo - Para tornar o reprodutor de vídeo transparente:
.s7mixedmediaviewer .s7videoplayer {
background-color: transparent;
}
As legendas são colocadas no contêiner interno no reprodutor de vídeo. A posição desse contêiner é controlada por operadores de posicionamento WebVTT compatíveis. O próprio texto da legenda está dentro desse contêiner; seu estilo é controlado com o seguinte seletor de classe CSS:
.s7mixedmediaviewer .s7videoplayer .s7caption
Propriedades CSS de legendas
Propriedade CSS |
Descrição |
---|---|
cor do fundo |
Plano de fundo do texto da legenda. |
color |
Cor do texto da legenda. |
font-weight |
Espessura da fonte. |
tamanho da fonte |
Tamanho da fonte. |
família de fontes |
Família de fontes. |
Exemplo - Para configurar o texto da legenda para ter 14 pixels de cor cinza claro Arial® em um plano de fundo preto 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;
}
A aparência da animação de buffering é controlada com o seguinte seletor de classe CSS:
.s7mixedmediaviewer .s7videoplayer .s7waiticon
Propriedades CSS do ícone de espera
Propriedade CSS |
Descrição |
---|---|
width |
Largura do ícone de animação. |
altura |
Altura do ícone de animação. |
margem esquerda |
Ícone de animação margem esquerda, normalmente menos metade da largura do ícone. |
margem superior |
Margem superior do ícone de animação, normalmente menos a metade da altura do ícone. |
imagem de fundo |
Arte do botão. |
Exemplo - Para configurar uma animação de buffer de 101 pixels de largura, 29 pixels de altura:
.s7mixedmediaviewer .s7videoplayer .s7waiticon {
width: 101px;
height: 29px;
margin-left: -50px;
margin-top: -15px;
background-image: url(images/sdk/busyicon.gif);
}