Schaltet die Anzeige der Untertitel ein bzw. aus. Sie ist nicht sichtbar, wenn der Beschriftungsparameter nicht angegeben ist. Sie können CSS verwenden, um diese Schaltfläche in der Größe, der Haut und der Position relativ zur Steuerleiste zu positionieren, die sie enthält.
CSS-Eigenschaften des Haupt-Viewer-Bereichs
Das Erscheinungsbild der Schaltfläche wird mit der folgenden CSS-Klassenauswahl gesteuert:
.s7mixedmediaviewer .s7closedcaptionbutton
CSS-Eigenschaft |
Beschreibung |
---|---|
Anfang |
Position vom oberen Rand, einschließlich Abstand. |
rechts |
Position vom rechten Rand, einschließlich Abstand. |
links |
Position vom linken Rand, einschließlich Abstand. |
unten |
Position vom unteren Rand, einschließlich Abstand. |
width |
Breite der Schaltfläche. |
height |
Höhe der Schaltfläche. |
background-image |
Das Bild, das für einen bestimmten Schaltflächenstatus angezeigt wird. |
background-position |
Position innerhalb des Bildsprites, wenn CSS-Sprites verwendet werden. Siehe CSS-Sprites . |
Diese Schaltfläche unterstützt state
-Attributauswahl und ausgewählte Attributselektoren, die verwendet werden können, um verschiedene Skins auf verschiedene Schaltflächenstatus anzuwenden. Insbesondere selected='true'
entspricht dem Status, wenn Beschriftungen sichtbar sind, und selected='false'
wird verwendet, wenn Beschriftungen ausgeblendet werden.
Die QuickInfo der Schaltfläche kann lokalisiert werden. Siehe Lokalisierung der Elemente der Benutzeroberfläche für weitere Informationen.
Beispiel: Um eine Schaltfläche mit verdeckten Untertiteln einzurichten, die 28 x 28 Pixel, vier Pixel von der oberen Seite und 68 Pixel von der rechten Kante der Steuerleiste entfernt ist. Schließlich zeigt ein anderes Bild für jeden der vier verschiedenen Schaltflächenstatus an, wenn diese ausgewählt sind oder nicht ausgewählt sind.
.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);
}