Questo pulsante attiva e disattiva la visualizzazione dei sottotitoli. Non è visibile se il parametro della didascalia non è specificato.
È possibile ridimensionare, applicare lo skin e posizionare questo pulsante rispetto alla barra di controllo che lo contiene utilizzando gli stili CSS.
L’aspetto di questo pulsante è controllato dal seguente selettore di classe CSS:
.s7interactivevideoviewer .s7closedcaptionbutton
Proprietà CSS del pulsante didascalia
top |
Posizione dal bordo superiore, inclusa la spaziatura. |
destra |
Posizione dal bordo destro, inclusa la spaziatura. |
left |
Posizione dal bordo sinistro, inclusa la spaziatura. |
bottom |
Posizione dal bordo inferiore, inclusa la spaziatura. |
width |
Larghezza del pulsante a schermo intero. |
height |
Altezza del pulsante a schermo intero. |
background-image |
Immagine visualizzata per un determinato stato del pulsante. |
background-position |
Posizionate all'interno dello sprite del disegno, se vengono utilizzati gli sprite CSS. Consulta Spunti CSS . |
Questo pulsante supporta sia state
e selected
selettori di attributi, che possono essere utilizzati per applicare interfacce diverse a stati di pulsante diversi. In particolare: selected='true'
corrisponde allo stato in cui sono visibili i sottotitoli e selected='false'
viene utilizzato quando i sottotitoli sono nascosti.
La descrizione comando del pulsante può essere localizzata. Consulta Localizzazione degli elementi dell’interfaccia utente per ulteriori informazioni.
Per impostare un pulsante per sottotitoli codificati di 28 x 28 pixel Il pulsante deve essere posizionato a quattro pixel dall'alto e a 68 pixel dal bordo destro della barra di controllo. Inoltre, deve visualizzare un'immagine diversa per ciascuno dei quattro diversi stati dei pulsanti, se selezionato o meno.
.s7interactivevideoviewer .s7closedcaptionbutton {
position:absolute;
top:4px;
right:68px;
width:28px;
height:28px;
}
.s7interactivevideoviewer .s7closedcaptionbutton[selected='true'][state='up'] {
background-image:url(images/v2/ClosedCaptionButton_up.png);
}
.s7interactivevideoviewer .s7closedcaptionbutton[selected='true'][state='over'] {
background-image:url(images/v2/ClosedCaptionButton_over.png);
}
.s7interactivevideoviewer .s7closedcaptionbutton[selected='true'][state='down'] {
background-image:url(images/v2/ClosedCaptionButton_down.png);
}
.s7interactivevideoviewer .s7closedcaptionbutton[selected='true'][state='disabled'] {
background-image:url(images/v2/ClosedCaptionButton_disabled.png);
}
.s7interactivevideoviewer .s7closedcaptionbutton[selected='false'][state='up'] {
background-image:url(images/v2/ClosedCaptionButton_disabled.png);
}
.s7interactivevideoviewer .s7closedcaptionbutton[selected='false'][state='over'] {
background-image:url(images/v2/ClosedCaptionButton_over.png);
}
.s7interactivevideoviewer .s7closedcaptionbutton[selected='false'][state='down'] {
background-image:url(images/v2/ClosedCaptionButton_down.png);
}
.s7interactivevideoviewer .s7closedcaptionbutton[selected='false'][state='disabled'] {
background-image:url(images/v2/ClosedCaptionButton_disabled.png);
}