Lecteur vidéo video-player

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

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

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

.s7interactivevideoviewer .s7videoplayer

Propriétés CSS du lecteur vidéo

arrière-plan-couleur
Couleur d’arrière-plan de la vue principale.

Vous pouvez localiser le message d’erreur qui s’affiche lorsque le système ne parvient pas à lire la vidéo.

Voir Localisation des éléments de l’interface utilisateur.

Exemple : pour configurer une visionneuse de vidéos avec une taille de lecteur vidéo définie sur 512 x 288 pixels.

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

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

.s7interactivevideoviewer .s7videoplayer .s7caption

Propriétés CSS du sous-titrage codé

arrière-plan-couleur
Arrière-plan du texte de la légende codée.
color
Couleur du texte de la légende de fermeture.
font-weight
Poids de police des sous-titres codés.
font-size
Taille de police de la légende fermée.
font-family
Police de la légende fermée.

Exemple section-5b82913ff3c44b7b8187969cb15e9560

Pour configurer le texte des sous-titres à 14 pixels, gris clair, Arial®, sur un arrière-plan noir semi-transparent :

.s7interactivevideoviewer .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é à l’aide du sélecteur de classe CSS suivant :

.s7interactivevideoviewer .s7videoplayer .s7waiticon

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

propriété CSS
Description
width
Largeur de l’icône d’animation.
height
Hauteur de l’icône d’animation.
margin-left
Marge gauche de l’icône d’animation, normalement moins la moitié de la largeur de l’icône.
margin-top
Marge supérieure de l’icône d’animation, normalement moins la moitié de la hauteur de l’icône.
background-image
Obtenir une illustration.

Exemple : pour configurer une animation de mise en mémoire tampon d’une largeur de 101 pixels et d’une hauteur de 29 pixels :

.s7interactivevideoviewer .s7videoplayer .s7waiticon {
 width: 101px;
 height: 29px;
 margin-left: -50px;
 margin-top: -15px;
 background-image: url(images/sdk/busyicon.gif);
}
recommendation-more-help
b7426f53-aad9-4c00-83fc-664f30f681e8