Videoplayer

Der Videoplayer ist der rechteckige Bereich, in dem der Videoinhalt im Viewer angezeigt wird.

Wenn die Abmessungen des abgespielten Videos nicht mit den Abmessungen des Videoplayers übereinstimmen, wird der Videoinhalt innerhalb des Rechteckanzeigebereichs des Videoplayers zentriert.

Die folgende CSS-Klassenauswahl steuert das Erscheinungsbild des Videoplayers:

.s7interactivevideoviewer .s7videoplayer

CSS-Eigenschaften des Videoplayers

background-color

Hintergrundfarbe der Haupt-Ansicht.

Sie können die Fehlermeldung lokalisieren, die angezeigt wird, wenn das System das Video nicht abspielen kann.

Siehe Lokale Anpassung der Elemente der Benutzeroberfläche.

Beispiel: Zum Einrichten eines Video-Viewers mit einer Videoplayer-Größe von 512 x 288 Pixel.

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

Untertitel werden in einen internen Container im Videoplayer eingefügt. Die Position dieses Containers wird von unterstützten WebVTT-Positionierungsoperatoren gesteuert. Der Beschriftungstext selbst befindet sich in diesem Container und sein Stil wird mit der folgenden CSS-Klassenauswahl gesteuert:

.s7interactivevideoviewer .s7videoplayer .s7caption

CSS-Eigenschaften von Untertiteln

background-color	Hintergrund für Bildunterschrift
color	Untertitel-Textfarbe schließen
font-Gewichtung	Gewichtung der Bildunterschrift
font-size	Schriftgröße der Bildunterschrift.
font-family	Geschlossene Beschriftungsschrift.

Beispiel

So richten Sie den Bildunterschriften-Text auf einem halbtransparenten schwarzen Hintergrund auf 14 Pixel (hellgrau, Arial) ein:

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

Das Erscheinungsbild der Pufferanimation wird mit der folgenden CSS-Klassenauswahl gesteuert:

.s7interactivevideoviewer .s7videoplayer .s7waiticon

CSS-Eigenschaften des Wartezeichens

CSS-Eigenschaft	Beschreibung
width	Breite des Animationssymbols
height	Höhe des Animationssymbols
margin-left	Animationssymbol links, normalerweise minus die Hälfte der Breite des Symbols.
margin-top	Animationssymbole am oberen Rand, normalerweise minus der Hälfte der Höhe des Symbols.
background-image	Knob-Grafik.

Beispiel: Um eine Pufferung mit einer Breite von 101 Pixeln und einer Höhe von 29 Pixeln einzurichten, müssen Sie eine Animation mit Pufferung einrichten:

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