Schaltfläche „Vollbild“ full-screen-button
Bewirkt, dass der Viewer in den Vollbildmodus wechselt oder diesen verlässt, wenn er vom Benutzer ausgewählt wurde. Diese Schaltfläche wird in der Hauptsteuerleiste angezeigt. Diese Schaltfläche wird nicht angezeigt, wenn der Viewer im Popup-Modus funktioniert und das System keinen nativen Vollbildmodus unterstützt. Sie können die Schaltfläche skalieren, mit der Haut versehen und per CSS positionieren.
CSS-Eigenschaften des Haupt-Viewer-Bereichs
Das Erscheinungsbild der Schaltfläche wird mit dem folgenden CSS-Klassenselektor gesteuert:
.s7ecatalogsearchviewer .s7fullscreenbutton
Positionieren Sie sie innerhalb des Bildsets, wenn CSS-Sprites verwendet werden.
Siehe auch CSS Sprites-.
state- als auch den selected-Attributselektor, mit dem verschiedene Skins auf verschiedene Schaltflächenzustände angewendet werden können. Insbesondere entspricht selected='true' dem „Vollbild“-Zustand und selected='false' dem „Normal“-Zustand.Die QuickInfo der Schaltfläche kann lokalisiert werden. Siehe Lokalisierung von Benutzeroberflächenelementen für weitere Informationen.
Beispiel: So richten Sie eine Vollbildschaltfläche ein, die 28 x 28 Pixel groß ist und 4 Pixel vom unteren Rand und 5 Pixel vom rechten Rand der Hauptsteuerleiste 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.
.s7ecatalogsearchviewer .s7fullscreenbutton {
bottom:4px;
right:5px;
width:28px;
height:28px;
}
.s7ecatalogsearchviewer .s7fullscreenbutton [selected='false'][state='up'] {
background-image:url(images/enterFullBtn_up.png);
}
.s7ecatalogsearchviewer .s7fullscreenbutton [selected='false'][state='over'] {
background-image:url(images/enterFullBtn_over.png);
}
.s7ecatalogsearchviewer .s7fullscreenbutton [selected='false'][state='down'] {
background-image:url(images/enterFullBtn_down.png);
}
.s7ecatalogsearchviewer .s7fullscreenbutton [selected='false'][state='disabled'] {
background-image:url(images/enterFullBtn_disabled.png);
}
.s7ecatalogsearchviewer .s7fullscreenbutton [selected='true'][state='up'] {
background-image:url(images/exitFullBtn_up.png);
}
.s7ecatalogsearchviewer .s7fullscreenbutton [selected='true'][state='over'] {
background-image:url(images/exitFullBtn_over.png);
}
.s7ecatalogsearchviewer .s7fullscreenbutton [selected='true'][state='down'] {
background-image:url(images/exitFullBtn_down.png);
}
.s7ecatalogsearchviewer .s7fullscreenbutton [selected='true'][state='disabled'] {
background-image:url(images/exitFullBtn_disabled.png); }
}