Hace que el usuario seleccione el modo de pantalla completa para entrar o salir del visor. Este botón no aparece si el visor funciona en modo emergente y el sistema no admite pantalla completa nativa. Puede cambiar el tamaño, la apariencia y la posición de este botón mediante CSS.
Propiedades CSS del área del visor principal
El aspecto del botón se controla con el siguiente selector de clase CSS:
.s7zoomviewer .s7fullscreenbutton
Propiedad CSS |
Descripción |
---|---|
parte superior |
Posición desde el borde superior, incluido el relleno. |
derecha |
Posición desde el borde derecho, incluido el relleno. |
izquierda |
Posición desde el borde izquierdo, incluido el relleno. |
parte inferior |
Posición desde el borde inferior, incluido el relleno. |
width |
Ancho del botón. |
height |
Altura del botón. |
background-image |
Imagen que se muestra para un estado de botón determinado. |
background-position |
Coloque dentro del icono de ilustración si se utilizan iconos CSS. Consulte Sprites CSS . |
Este botón es compatible con el state
y selected
selectores de atributos, que se pueden utilizar para aplicar diferentes aspectos a diferentes estados de botones. En particular, selected='true'
corresponde al estado “pantalla completa” y selected='false'
corresponde al estado “normal”.
La información del objeto del botón se puede localizar. Consulte Localización de elementos de la interfaz de usuario.
Ejemplo: Para configurar un botón de pantalla completa de 32 x 32 píxeles y colocado a seis píxeles de la parte superior y el borde derecho del visor. Y, por último, muestra una imagen diferente para cada uno de los cuatro estados de botón cuando se selecciona o no se selecciona:
.s7zoomviewer .s7fullscreenbutton {
top:6px;
right:6px;
width:32px;
height:32px;
}
.s7zoomviewer .s7fullscreenbutton [selected='false'][state='up'] {
background-image:url(images/enterFullBtn_up.png);
}
.s7zoomviewer .s7fullscreenbutton [selected='false'][state='over'] {
background-image:url(images/enterFullBtn_over.png);
}
.s7zoomviewer .s7fullscreenbutton [selected='false'][state='down'] {
background-image:url(images/enterFullBtn_down.png);
}
.s7zoomviewer .s7fullscreenbutton [selected='false'][state='disabled'] {
background-image:url(images/enterFullBtn_disabled.png);
}
.s7zoomviewer .s7fullscreenbutton [selected='true'][state='up'] {
background-image:url(images/exitFullBtn_up.png);
}
.s7zoomviewer .s7fullscreenbutton [selected='true'][state='over'] {
background-image:url(images/exitFullBtn_over.png);
}
.s7zoomviewer .s7fullscreenbutton [selected='true'][state='down'] {
background-image:url(images/exitFullBtn_down.png);
}
.s7zoomviewer .s7fullscreenbutton [selected='true'][state='disabled'] {
background-image:url(images/exitFullBtn_disabled.png); }
}