Imposta indicatore set-indicator

Imposta indicatore è una serie di punti di cui viene eseguito il rendering sopra i campioni principali quando un visualizzatore viene utilizzato su un dispositivo touch. I punti consentono agli utenti di spostarsi tra le pagine delle miniature quando i pulsanti di scorrimento non sono disponibili.

Proprietà CSS dell'indicatore impostato

L’aspetto del contenitore di indicatori impostato è controllato dal seguente selettore di classe CSS:

.s7mixedmediaviewer .s7setindicator
Proprietà CSS
Descrizione
colore di sfondo
Colore di sfondo in formato esadecimale dell'indicatore impostato.

Esempio - Per creare un indicatore impostato con uno sfondo bianco:

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

L’aspetto di un singolo punto indicatore di set è controllato con il selettore di classe CSS:

.s7mixedmediaviewer .s7setindicator .s7dot

Proprietà CSS
Descrizione
larghezza
Larghezza dell'indicatore impostato punto.
altezza
Altezza del punto indicatore impostato.
margine sinistro
Margine sinistro in pixel.
margine superiore
Margine superiore in pixel.
margine destro
Margine destro in pixel.
margine inferiore
Margine inferiore in pixel.
raggio bordo
Raggio del bordo in pixel.
colore di sfondo
Colore di sfondo in formato esadecimale.
NOTE
Il punto indicatore impostato supporta il selettore di attributi state, che può essere utilizzato per applicare interfacce diverse a stati di miniature diversi. In particolare, state="selected" corrisponde alla pagina corrente delle miniature, state="unselected" corrisponde allo stato predefinito del punto.

Esempio - Per creare un punto indicatore impostato di 15 x 15 pixel, con un margine orizzontale di due pixel, un margine superiore di cinque pixel, un margine inferiore di un pixel, un raggio di 12 pixel, #D5D3D3 colore predefinito e #939393 colore attivo:

.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