Anzeige einstellen set-indicator

Set Indicator ist eine Reihe von Punkten, die auf Hauptmustern gerendert werden, wenn ein Viewer auf einem Touch-Gerät verwendet wird. Die Punkte helfen Benutzern, durch Seiten von Miniaturansichten zu navigieren, wenn keine Bildlaufschaltflächen verfügbar sind.

CSS-Eigenschaften des Set Indicators

Das Erscheinungsbild des set-Indikator-Containers wird mit der folgenden CSS-Klassenauswahl gesteuert:

.s7mixedmediaviewer .s7setindicator
CSS-Eigenschaft
Beschreibung
background-color
Die Hintergrundfarbe im hexadezimalen Format des Set-Indikators.

Beispiel - So erstellen Sie einen Indikator mit einem weißen Hintergrund:

.s7mixedmediaviewer .s7setindicator {
 background-color: #FFFFFF;
}

Das Erscheinungsbild eines einzelnen Satzanzeigepunkts wird mit der CSS-Klassenauswahl gesteuert:

.s7mixedmediaviewer .s7setindicator .s7dot

CSS-Eigenschaft
Beschreibung
width
Breite des festgelegten Anzeigepunkts.
height
Höhe des festgelegten Anzeigepunkts.
margin-left
Linker Rand in Pixel.
margin-top
Oberer Rand in Pixel.
margin-right
Rechter Rand in Pixel.
margin-bottom
Unterer Rand in Pixel.
border-radius
Rahmenradius in Pixel.
background-color
Hintergrundfarbe im hexadezimalen Format.
NOTE
Der Anzeigepunkt "Festlegen"unterstützt state -Attributauswahl, die verwendet werden kann, um verschiedene Skins auf verschiedene Miniaturansichten anzuwenden. Insbesondere state="selected" entspricht der aktuellen Seite der Miniaturansichten; state="unselected" entspricht dem Standardpunktstatus.

Beispiel: So erstellen Sie einen festgelegten Anzeigepunkt mit 15 x 15 Pixel mit einem horizontalen Rand von zwei Pixeln, einem oberen Rand von fünf Pixeln, einem unteren Rand von einem Pixel, einem Radius von 12 Pixeln, einer Standardfarbe von #D5D3D3 und einer aktiven Farbe von #9393:

.s7mixedmediaviewer .s7setindicator .s7dot {
 width:15px;
 height:15px;
 margin-left:2px;
 margin-top:5px;
 margin-right:2px;
 margin-bottom:1px;
 border-radius:12px;
 background-color:#D5D3D3;
}
.s7mixedmediaviewer .s7setindicator .s7dot[state="selected"] {
 background-color:#939393;
}
recommendation-more-help
b7426f53-aad9-4c00-83fc-664f30f681e8