Schaltfläche „Beschriftung“ caption-button
Mit dieser Schaltfläche wird die Untertitelanzeige ein- und ausgeschaltet. Sie ist nicht sichtbar, wenn der Beschriftungsparameter nicht angegeben ist.
Mithilfe von CSS können Sie diese Schaltfläche in der Größe, im Design und in der Position relativ zur darin enthaltenen Steuerleiste anpassen.
Das Erscheinungsbild dieser Schaltfläche wird mit dem folgenden CSS-Klassenselektor gesteuert:
.s7videoviewer .s7closedcaptionbutton
CSS-Eigenschaften der Beschriftungsschaltfläche
state- als auch den selected-Attributselektor, mit dem verschiedene Skins auf verschiedene Schaltflächenzustände angewendet werden können. Insbesondere entspricht selected='true' dem Status, wenn Beschriftungen sichtbar sind, und selected='false' wird verwendet, wenn Beschriftungen ausgeblendet sind.Die QuickInfo der Schaltfläche kann lokalisiert werden. Siehe Lokalisierung von Benutzeroberflächenelementen für weitere Informationen.
Beispiel section-e8caea0a303c425a8a637c2a47c06355
So richten Sie eine Untertitelschaltfläche ein, die 28 x 28 Pixel groß ist und vier Pixel vom oberen und 68 Pixel vom rechten Rand der Steuerleiste entfernt positioniert ist. Und schließlich zeigt ein anderes Bild für jeden der vier verschiedenen Schaltflächenstatus an, wenn ausgewählt oder nicht ausgewählt.
.s7videoviewer .s7closedcaptionbutton {
position:absolute;
top:4px;
right:68px;
width:28px;
height:28px;
}
.s7videoviewer .s7closedcaptionbutton[selected='true'][state='up'] {
background-image:url(images/v2/ClosedCaptionButton_up.png);
}
.s7videoviewer .s7closedcaptionbutton[selected='true'][state='over'] {
background-image:url(images/v2/ClosedCaptionButton_over.png);
}
.s7videoviewer .s7closedcaptionbutton[selected='true'][state='down'] {
background-image:url(images/v2/ClosedCaptionButton_down.png);
}
.s7videoviewer .s7closedcaptionbutton[selected='true'][state='disabled'] {
background-image:url(images/v2/ClosedCaptionButton_disabled.png);
}
.s7videoviewer .s7closedcaptionbutton[selected='false'][state='up'] {
background-image:url(images/v2/ClosedCaptionButton_disabled.png);
}
.s7videoviewer .s7closedcaptionbutton[selected='false'][state='over'] {
background-image:url(images/v2/ClosedCaptionButton_over.png);
}
.s7videoviewer .s7closedcaptionbutton[selected='false'][state='down'] {
background-image:url(images/v2/ClosedCaptionButton_down.png);
}
.s7videoviewer .s7closedcaptionbutton[selected='false'][state='disabled'] {
background-image:url(images/v2/ClosedCaptionButton_disabled.png);
}