Video-Scrubber

Der Video-Scrubber ist der horizontale Regler, mit dem ein Benutzer dynamisch nach einer beliebigen Zeitposition innerhalb des derzeit wiedergegebenen Videos suchen kann.

Der Navigationsleisten-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 in die Haut zu stecken. ihre Höhe und ihre vertikale Position durch CSS ändern.

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

.s7video360viewer .s7videoscrubber 
.s7video360viewer .s7videoscrubber .s7videotime 
.s7video360viewer .s7videoscrubber .s7knob

CSS-Eigenschaften des Videobildschirms

Anfang

Position vom oberen Rand, einschließlich Auffüllung.

unten

Position vom unteren Rand, einschließlich Auffüllung.

height

Höhe des Videobildschirms.

background-color

Die Farbe des Videobildschirms.

Die folgenden CSS-Klassenselektoren verfolgen Hintergrund-, Wiedergabe- und Load-Indikatoren:

.s7video360viewer .s7videoscrubber .s7track 
.s7video360viewer .s7videoscrubber .s7trackloaded 
.s7video360viewer .s7videoscrubber .s7trackplayed

CSS-Eigenschaften der Verfolgung

height

Höhe der entsprechenden Spur.

background-color

Die Farbe der entsprechenden Spur.

Der folgende CSS-Klassenselektor steuert den Knoten:

.s7video360viewer .s7videoscrubber .s7knob

CSS-Eigenschaften des Knotens

Anfang

Vertikaler Knopfversatz.

width

Breite des Knopfes.

height

Höhe des Knopfes.

background-image

Knob-Grafik.

background-position

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

Siehe CSS-Sprites .

Mit dem folgenden CSS-Klassenselektor wird die Wiedergabedauer gesteuert:

.s7video360viewer .s7videoscrubber .s7videotime

CSS-Eigenschaften der Wiedergabepause

font-family

Die Schriftfamilie, die für die Zeitanzeige verwendet wird.

font-size

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

color

Die Schriftfarbe, die für die Zeitanzeige verwendet wird.

width

Punktflächenbreite.

height

Punktflächenhöhe.

Padding

Punktflächenfüllung.

background-image

Blasengrafik.

background-position

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

Siehe CSS-Sprites .

text-align

Ausrichtung des Textes am Blasenbereich

Die QuickInfo zum Video-Scrubber kann lokalisiert werden. Weitere Informationen finden Sie unter Lokale Anpassung der Elemente der Benutzeroberfläche.

Beispiel : Zum Einrichten eines Video-Viewers mit einem Video-Scrubber mit benutzerdefinierten Trackfarben, die 10 Pixel hoch und 10 Pixel und 35 Pixel von der oberen und linken Kante der Steuerungsleiste entfernt sind.

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

Auf dieser Seite

Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free
Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free
Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now
Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now