Videoscrubber video-scrubber

De videoscrubber is de horizontale schuifregelaar waarmee een gebruiker dynamisch naar een willekeurige tijdpositie in de video kan zoeken die momenteel wordt afgespeeld.

De scrubber 'knob' beweegt zich ook terwijl de video speelt om op de huidige tijdpositie van de video tijdens playback te wijzen. De videoscrubber neemt altijd de volledige breedte van de controlebar. Het is mogelijk om de videoscrubber van een skin te voorzien en de hoogte en verticale positie te wijzigen met behulp van CSS.

De algemene weergave van de videoscrubber wordt beheerd met de volgende CSS-klassenkiezer:

.s7mixedmediaviewer .s7videoscrubber
.s7mixedmediaviewer .s7videoscrubber .s7videotime
.s7mixedmediaviewer .s7videoscrubber .s7knob

CSS-eigenschappen van de videoscrubber

De volgende CSS-klassekiezers volgen de indicatoren voor achtergrond, afspelen en laden:

.s7mixedmediaviewer .s7videoscrubber .s7track
.s7mixedmediaviewer .s7videoscrubber .s7trackloaded
.s7mixedmediaviewer .s7videoscrubber .s7trackplayed

CSS-eigenschappen van de track

De volgende CSS-klassenkiezer bestuurt de knop:

.s7mixedmediaviewer .s7videoscrubber .s7knob

CSS-eigenschappen van de knop

De volgende CSS-klassenkiezer bestuurt de zeepbel waarin de tijd wordt afgespeeld:

.s7mixedmediaviewer .s7videoscrubber .s7videotime

CSS-eigenschappen van de afgespeelde bel

De knopinfo voor het gereedschap Video scrubber kan worden gelokaliseerd. Zie Lokalisatie van gebruikersinterface-elementen voor meer informatie .

Voorbeeld section-e8caea0a303c425a8a637c2a47c06355

Stel een viewer voor gemengde media in met een videoscrubber met aangepaste trackkleuren die 10 pixels hoog zijn en die 10 pixels en 35 pixels van de boven- en linkerrand van de besturingsbalk zijn geplaatst.

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