Video-Player
Erstellt für:
- Entwickler
- Benutzende
Der Video-Player ist der rechteckige Bereich, in dem der Videoinhalt im Viewer angezeigt wird.
Wenn die Abmessungen des wiedergegebenen Videos nicht den Abmessungen des Video-Players entsprechen, wird der Videoinhalt im rechteckigen Anzeigebereich des Video-Players zentriert.
Der folgende CSS-Klassenselektor steuert das Erscheinungsbild des Video-Players:
.s7mixedmediaviewer .s7videoplayer
CSS-Eigenschaften des Video-Players
| - | Die Hintergrundfarbe des Video-Players. |
Die Fehlermeldung, die angezeigt wird, wenn das System das Video nicht abspielen kann, kann lokalisiert werden. Siehe Lokalisierung von Benutzeroberflächenelementen für weitere Informationen.
Beispiel - So machen Sie den Video-Player transparent:
.s7mixedmediaviewer .s7videoplayer {
background-color: transparent;
}
Untertitel werden in einen internen Container im Video-Player eingefügt. Die Position dieses Containers wird durch unterstützte WebVTT-Positionierungsoperatoren gesteuert. Der Beschriftungstext selbst befindet sich in diesem Container. Sein Stil wird mit dem folgenden CSS-Klassenselektor gesteuert:
.s7mixedmediaviewer .s7videoplayer .s7caption
CSS-Eigenschaften von Beschriftungen
| CSS-Eigenschaft | Beschreibung |
|---|---|
| - | Beschriftungstext-Hintergrund. |
| - | Textfarbe der Beschriftung. |
| - | Schriftstärke. |
| - | Schriftgröße. |
| - | Schriftfamilie. |
Beispiel : Einrichten von Untertiteltext als hellgraues Arial®-Objekt mit 14 Pixeln auf einem halbtransparenten schwarzen Hintergrund:
.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;
}
Das Erscheinungsbild der Pufferanimation wird mit dem folgenden CSS-Klassenselektor gesteuert:
.s7mixedmediaviewer .s7videoplayer .s7waiticon
CSS-Eigenschaften des Wartesymbols
| CSS-Eigenschaft | Beschreibung |
|---|---|
| Breite | Breite des Animationssymbols |
| Höhe | Höhe des Animationssymbols. |
| Rand links | Animationssymbol Linker Rand, normalerweise minus der Hälfte der Breite des Symbols. |
| - | Oberer Rand des Animationssymbols, normalerweise abzüglich der Hälfte der Höhe des Symbols. |
| Hintergrundbild- | Knopf-Bildmaterial. |
Beispiel : Zum Einrichten einer Puffer-Animation, sodass sie 101 Pixel breit und 29 Pixel hoch ist:
.s7mixedmediaviewer .s7videoplayer .s7waiticon {
width: 101px;
height: 29px;
margin-left: -50px;
margin-top: -15px;
background-image: url(images/sdk/busyicon.gif);
}