Lecteur vidéo video-player

Le lecteur vidéo est la zone rectangulaire où le contenu vidéo est affiché dans la visionneuse.

Si les dimensions de la vidéo lue ne correspondent pas à celles du lecteur vidéo, le contenu vidéo est centré dans la zone d’affichage en rectangle du lecteur vidéo.

Le sélecteur de classe CSS suivant contrôle l’aspect du lecteur vidéo :

.s7mixedmediaviewer .s7videoplayer

Propriétés CSS du lecteur vidéo

Le message d’erreur qui s’affiche si le système ne parvient pas à lire la vidéo peut être localisé. Voir Localisation des éléments de l’interface utilisateur pour plus d’informations.

Exemple - Pour rendre le lecteur vidéo transparent :

.s7mixedmediaviewer .s7videoplayer {
 background-color: transparent;
}

Les sous-titres sont placés dans un conteneur interne à l’intérieur du lecteur vidéo. La position de ce conteneur est contrôlée par des opérateurs de positionnement WebVTT pris en charge. Le texte de légende lui-même se trouve à l’intérieur de ce conteneur ; son style est contrôlé par le sélecteur de classe CSS suivant :

.s7mixedmediaviewer .s7videoplayer .s7caption

Propriétés CSS des légendes

Exemple - Pour définir le texte de la légende sur un Arial gris clair de 14 pixels® sur un arrière-plan noir semi-transparent :

.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;
}

L’aspect de l’animation de mise en mémoire tampon est contrôlé avec le sélecteur de classe CSS suivant :

.s7mixedmediaviewer .s7videoplayer .s7waiticon

Propriétés CSS de l’icône d’attente

Exemple - Pour configurer une animation de mise en mémoire tampon sur une largeur de 101 pixels et une hauteur de 29 pixels :

.s7mixedmediaviewer .s7videoplayer .s7waiticon {
 width: 101px;
 height: 29px;
 margin-left: -50px;
 margin-top: -15px;
 background-image: url(images/sdk/busyicon.gif);
}