Pulsante Didascalia caption-button

Attiva e disattiva la visualizzazione dei sottotitoli. Non è visibile se il parametro della didascalia non è specificato. È possibile utilizzare CSS per ridimensionare, applicare lo skin e posizionare il pulsante rispetto alla barra di controllo che lo contiene.

Proprietà CSS dell'area visualizzatore principale

L’aspetto del pulsante è controllato dal seguente selettore di classe CSS:

.s7mixedmediaviewer .s7closedcaptionbutton
Proprietà CSS
Descrizione
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.
height
Altezza del pulsante.
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.

NOTE
Questo pulsante supporta state selettore di attributi e selettori di attributi selezionati, 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.

Esempio: per impostare un pulsante Sottotitoli codificati di 28 x 28 pixel, posizionato quattro pixel dalla parte superiore e 68 pixel dal bordo destro della barra di controllo. Infine, visualizza un'immagine diversa per ciascuno dei quattro diversi stati del pulsante, se selezionato o meno.

.s7mixedmediaviewer .s7closedcaptionbutton {
 position:absolute;
 top:4px;
 right:68px;
 width:28px;
 height:28px;
}
.s7mixedmediaviewer .s7closedcaptionbutton[selected='true'][state='up'] {
background-image:url(images/v2/ClosedCaptionButton_up.png);
}
.s7mixedmediaviewer .s7closedcaptionbutton[selected='true'][state='over'] {
background-image:url(images/v2/ClosedCaptionButton_over.png);
}
.s7mixedmediaviewer .s7closedcaptionbutton[selected='true'][state='down'] {
background-image:url(images/v2/ClosedCaptionButton_down.png);
}
.s7mixedmediaviewer .s7closedcaptionbutton[selected='true'][state='disabled'] {
background-image:url(images/v2/ClosedCaptionButton_disabled.png);
}
.s7mixedmediaviewer .s7closedcaptionbutton[selected='false'][state='up'] {
background-image:url(images/v2/ClosedCaptionButton_disabled.png);
}
.s7mixedmediaviewer .s7closedcaptionbutton[selected='false'][state='over'] {
background-image:url(images/v2/ClosedCaptionButton_over.png);
}
.s7mixedmediaviewer .s7closedcaptionbutton[selected='false'][state='down'] {
background-image:url(images/v2/ClosedCaptionButton_down.png);
}
.s7mixedmediaviewer .s7closedcaptionbutton[selected='false'][state='disabled'] {
background-image:url(images/v2/ClosedCaptionButton_disabled.png);
}
recommendation-more-help
b7426f53-aad9-4c00-83fc-664f30f681e8