Definir indicador

El indicador de conjunto es una serie de puntos procesados sobre las muestras 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 establecido se controla con el siguiente selector de clase CSS:

.s7zoomviewer .s7setindicator

CSS, propiedad

Descripción

background-color

Color de fondo en formato hexadecimal del indicador establecido.

Ejemplo: para configurar el indicador de configuración con un fondo blanco:

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

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

.s7zoomviewer .s7setindicator .s7dot

CSS, propiedad

Descripción

width

Ancho del punto indicador establecido.

height

Altura del punto indicador establecido.

margin-left

Margen izquierdo en píxeles.

margin-top

Margen superior en píxeles.

margin-right

Margen derecho en píxeles.

margin-bottom

Margen inferior en píxeles.

border-radius

Radio del borde en píxeles.

background-color

Color de fondo en formato hexadecimal.

NOTA

El punto indicador de conjunto admite el selector de atributos state, que se puede utilizar para aplicar diferentes apariencias a distintos 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 configurar un punto indicador definido de 15 x 15 píxeles, con dos píxeles de margen horizontal, cinco píxeles de margen superior, un píxel de margen inferior, doce píxeles de radio, #D5D3D3 color predeterminado y #939393 color activo:

.s7zoomviewer .s7setindicator .s7dot { 
 width:15px; 
 height:15px; 
 margin-left:2px; 
 margin-top:5px; 
 margin-right:2px; 
 margin-bottom:1px; 
 border-radius:12px; 
 background-color:#D5D3D3;  
} 
.s7zoomviewer .s7setindicator .s7dot[state="selected"] { 
 background-color:#939393;  
}

En esta página

Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free
Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free