Videobauber

Der Video-Scrubber ist das horizontale Regler-Steuerelement, mit dem ein Benutzer dynamisch an eine beliebige Zeitposition innerhalb des derzeit wiedergegebenen Videos suchen kann.

Der Scrubber-Knopf bewegt sich auch, während das Video abgespielt wird, um die aktuelle Zeitposition des Videos während der Wiedergabe anzugeben. Der Video-Scrubber nimmt immer die gesamte Breite der Steuerleiste ein. Es ist möglich, den Video-Scrubber per CSS zu belichten, seine Höhe und vertikale Position zu ändern.

Das allgemeine Erscheinungsbild des Video-Scrubbers wird mit der folgenden CSS-Klassenauswahl gesteuert:

.s7smartcropvideoviewer .s7videoscrubber
.s7smartcropvideoviewer .s7videoscrubber .s7videotime
.s7smartcropvideoviewer .s7videoscrubber .s7knob

CSS-Eigenschaften des Video-Scrubbers

Anfang

Position vom oberen Rand, einschließlich Abstand.

unten

Position vom unteren Rand, einschließlich Abstand.

height

Höhe des Video-Scrubbers.

background-color

Die Farbe des Video-Scrubbers.

Die folgenden CSS-Klassenselektoren verfolgen Hintergrund-, Wiedergabe- und Lastindikatoren:

.s7smartcropvideoviewer .s7videoscrubber .s7track
.s7smartcropvideoviewer .s7videoscrubber .s7trackloaded
.s7smartcropvideoviewer .s7videoscrubber .s7trackplayed

CSS-Eigenschaften des Tracks

height

Höhe der entsprechenden Strecke.

background-color

Die Farbe der entsprechenden Strecke.

Der folgende CSS-Klassenselektor steuert den Knoten:

.s7smartcropvideoviewer .s7videoscrubber .s7knob

CSS-Eigenschaften des Knotens

Anfang

Vertikaler Drehversatz.

width

Breite des Knopfes.

height

Höhe des Knotens.

background-image

Knob-Grafik.

background-position

Position innerhalb des Bildsprites, wenn CSS-Sprites verwendet werden.

Siehe CSS-Sprites .

Der folgende CSS-Klassenselektor steuert die Wiedergabedauer:

.s7smartcropvideoviewer .s7videoscrubber .s7videotime

CSS-Eigenschaften der wiedergegebenen Blase

Schriftfamilie

Die Schriftfamilie, die für die Zeitanzeige verwendet werden soll.

Schriftgröße

Die Schriftgröße, die für die Zeitanzeige verwendet werden soll.

color

Die Schriftfarbe für die Zeitanzeige.

width

Blasenbereichbreite.

height

Blasenbereichshöhe.

Padding

Blasenflächen-Umrandung.

background-image

Blasengrafik.

background-position

Position innerhalb des Bildsprites, wenn CSS-Sprites verwendet werden.

Siehe CSS-Sprites .

text-align

Ausrichtung des Texts am Blasenbereich

Die QuickInfo für Video-Scrubber kann lokalisiert werden. Siehe Lokalisierung der Elemente der Benutzeroberfläche für weitere Informationen.

Beispiel - Um einen Video-Viewer mit einem Video-Scrubber mit benutzerdefinierten Tracking-Farben einzurichten, die zehn Pixel groß sind. Und schließlich, lassen Sie es 10 Pixel und 35 Pixel von der oberen und linken Kante der Steuerleiste positioniert.

.s7smartcropvideoviewer .s7videoscrubber  {
top:10px;
left:35px;
height:10px;
background-color:#AAAAAA;
}
.s7smartcropvideoviewer .s7videoscrubber .s7track {
height:10px;
background-color:#444444;
}
.s7smartcropvideoviewer .s7videoscrubber .s7trackloaded {
height:10px;
background-color:#666666;
}
.s7smartcropvideoviewer .s7videoscrubber .s7trackplayed {
height:10px;
background-color:#888888;
}

Auf dieser Seite