Schaltfläche "Erste Seite" first-page-button

Wenn Sie auf diese Schaltfläche klicken oder tippen, wird der Benutzer zur ersten Seite des Katalogs geleitet. Diese Schaltfläche wird in der Hauptsteuerleiste auf Desktop-Systemen und Tablets angezeigt. auf Mobiltelefonen wird sie zu einer sekundären Kontrollleiste hinzugefügt. Mithilfe von CSS können Sie diese Schaltfläche vergrößern, verkleinern und positionieren.

CSS-Eigenschaften des Haupt-Viewer-Bereichs

Das Erscheinungsbild der Schaltfläche wird mit der folgenden CSS-Klassenauswahl gesteuert:

.s7ecatalogsearchviewer .s7firstpagebutton .s7panleftbutton

CSS-Eigenschaft
Beschreibung
Anfang
Position vom oberen Rand der Hauptsteuerleiste (auf Desktop-Systemen und Tablets) oder der sekundären Steuerleiste (auf Mobiltelefonen), einschließlich Abstandflächen.
rechts
Position vom rechten Rand der Hauptsteuerleiste (auf Desktop-Systemen und Tablets) oder der sekundären Steuerleiste (auf Mobiltelefonen), einschließlich Abstandflächen.
links
Position vom linken Rand der Hauptsteuerleiste (auf Desktop-Systemen und Tablets) oder der sekundären Steuerleiste (auf Mobiltelefonen), einschließlich Abstandflächen.
unten
Position vom unteren Rand der Hauptsteuerleiste (auf Desktop-Systemen und Tablets) oder der sekundären Steuerleiste (auf Mobiltelefonen), einschließlich Abstandflächen.
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 auch CSS-Sprites.

NOTE
Diese Schaltfläche unterstützt state -Attributauswahl, die verwendet werden kann, um verschiedene Skins auf verschiedene Schaltflächenzustände anzuwenden.

Die QuickInfo der Schaltfläche kann lokalisiert werden. Siehe Lokalisierung der Elemente der Benutzeroberfläche für weitere Informationen.

Beispiel: Um eine Schaltfläche für die erste Seite einzurichten, die 28 x 28 Pixel groß ist und 4 Pixel vom unteren Rand und 220 Pixel vom linken Rand der Hauptsteuerleiste positioniert. Und schließlich zeigt ein anderes Bild für jeden der vier verschiedenen Schaltflächenstatus an.

.s7ecatalogsearchviewer .s7firstpagebutton .s7panleftbutton {
bottom:4px;
left:220px;
width:32px;
height:32px;
}
.s7ecatalogsearchviewer .s7firstpagebutton .s7panleftbutton [state='up'] {
background-image:url(images/v2/FirstPageButton_dark_up.png);
}
.s7ecatalogsearchviewer .s7firstpagebutton .s7panleftbutton [state='over'] {
background-image:url(images/v2/FirstPageButton_dark_over.png);
}
.s7ecatalogsearchviewer .s7firstpagebutton .s7panleftbutton [state='down'] {
background-image:url(images/v2/FirstPageButton_dark_down.png);
}
.s7ecatalogsearchviewer .s7firstpagebutton .s7panleftbutton [state='disabled'] {
background-image:url(images/v2/FirstPageButton_dark_disabled.png);
}
recommendation-more-help
b7426f53-aad9-4c00-83fc-664f30f681e8