Definir indicador set-indicator

El indicador de conjunto es una serie de puntos que se representan sobre las muestras principales cuando se utiliza un visor en un dispositivo táctil. Los puntos ayudan a los usuarios a navegar por las páginas de miniaturas cuando los botones de desplazamiento no están disponibles.

Propiedades CSS del indicador establecido

El aspecto del contenedor del indicador determinado se controla con el siguiente selector de clase CSS:

.s7mixedmediaviewer .s7setindicator
Propiedad CSS
Descripción
color de fondo
El color de fondo en formato hexadecimal del indicador determinado.

Ejemplo: Para crear un indicador de conjunto con un fondo blanco:

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

El aspecto de un punto indicador de conjunto individual se controla con el selector de clases CSS:

.s7mixedmediaviewer .s7setindicator .s7dot

Propiedad CSS
Descripción
ancho
Anchura del punto del indicador definido.
altura
Altura del punto del indicador definido.
margen restante
Margen izquierdo en píxeles.
margen superior
Margen superior en píxeles.
margen derecho
Margen derecho en píxeles.
margen inferior
Margen inferior en píxeles.
borde-radio
Radio de borde en píxeles.
color de fondo
Color de fondo en formato hexadecimal.
NOTE
El punto de indicador definido es compatible con el selector de atributos state, que se puede utilizar para aplicar diferentes aspectos a diferentes estados de miniaturas. En particular, state="selected" corresponde a la página actual de miniaturas, state="unselected" corresponde al estado de punto predeterminado.

Ejemplo: Para crear un punto de indicador de conjunto de 15 x 15 píxeles, con un margen horizontal de dos píxeles, un margen superior de cinco píxeles, un margen inferior de un píxel, un radio de 12 píxeles, #D5D3D3 color predeterminado y #939393 color activo:

.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