DocumentazioneGuida di riferimento per i visualizzatori di Dynamic Medie

Scorrimento video video-scrubber

Last update: Sat Jul 20 2024 00:00:00 GMT+0000 (Coordinated Universal Time)
  • Argomenti:

Creato per:

  • Sviluppatore
  • Utente

Lo scorrimento video è il dispositivo di scorrimento orizzontale che consente all’utente di cercare dinamicamente una posizione temporale all’interno del video attualmente in riproduzione.

La "manopola" di scorrimento si sposta anche durante la riproduzione del video per indicare la posizione temporale corrente del video durante la riproduzione. Lo scorrimento video occupa sempre l'intera larghezza della barra di controllo. È possibile applicare lo skin al video scrubber, modificarne l’altezza e la posizione verticale, mediante CSS.

L’aspetto generale dello scorrimento dei video è controllato dal seguente selettore di classe CSS:

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

Proprietà CSS dello scorrimento video

primi
Posizione dal bordo superiore, inclusa la spaziatura.
in basso
Posizione dal bordo inferiore, inclusa la spaziatura.
altezza
Altezza dello scorrimento video.
colore di sfondo
Colore dello scorrimento video.

I seguenti selettori di classi CSS tengono traccia degli indicatori di sfondo, riproduzione e caricamento:

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

Proprietà CSS del brano

altezza
Altezza del brano corrispondente.
colore di sfondo
Colore del brano corrispondente.

Il seguente selettore di classe CSS controlla la manopola:

.s7smartcropvideoviewer .s7videoscrubber .s7knob

Proprietà CSS della manopola

primi
Offset manopola verticale.
larghezza
Larghezza manopola.
altezza
Altezza manopola.
immagine di sfondo
Grafica a manopola.
background-position

Posizionate all'interno dello sprite del disegno, se vengono utilizzati gli sprite CSS.

Vedere sprite CSS.

Il seguente selettore di classe CSS controlla la bolla del tempo riprodotto:

.s7smartcropvideoviewer .s7videoscrubber .s7videotime

Proprietà CSS dell'indicatore del tempo riprodotto

famiglia di caratteri
Famiglia di font da utilizzare per il testo visualizzato nel tempo.
font-size
Dimensione font da utilizzare per il testo visualizzato nel tempo.
colore
Colore del carattere da utilizzare per il testo visualizzato nel tempo.
larghezza
Larghezza area bolle.
altezza
Altezza area bolle.
riempimento
Spaziatura interna area bolle.
immagine di sfondo
Illustrazione di bolle.
background-position

Posizionate all'interno dello sprite del disegno, se vengono utilizzati gli sprite CSS.

Vedere sprite CSS.

allinea testo
Allineamento del testo con l'area a bolle.

La descrizione comando dello scorrimento video può essere localizzata. Per ulteriori informazioni, vedere Localizzazione degli elementi dell'interfaccia utente.

Esempio - Per impostare un visualizzatore video con uno scorrimento video con colori di traccia personalizzati alti dieci pixel. Infine, posizionarlo a 10 e 35 pixel dai bordi superiore e sinistro della barra di controllo.

.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;
}
recommendation-more-help
b7426f53-aad9-4c00-83fc-664f30f681e8