Hace que el usuario introduzca o salga del modo de pantalla completa cuando lo selecciona. Este botón aparece en la barra de control principal. Este botón no se muestra si el visor funciona en modo emergente y el sistema no admite pantalla completa nativa. Puede cambiar el tamaño, el aspecto y colocar el botón mediante CSS.
Propiedades CSS del área principal del visor
El aspecto del botón se controla con el siguiente selector de clase CSS:
.s7ecatalogsearchviewer .s7fullscreenbutton
CSS, propiedad |
Descripción |
---|---|
parte superior |
Posición desde el borde superior de la barra de control principal, incluido el relleno. |
derecha |
Posición desde el borde derecho de la barra de control principal, incluido el relleno. |
izquierda |
Posición desde el borde izquierdo de la barra de control principal, incluido el relleno. |
parte inferior |
Posición desde el borde inferior de la barra de control principal, incluido el relleno. |
width |
Anchura del botón. |
height |
Altura del botón. |
imagen de fondo |
Imagen que se muestra para un estado de botón determinado. |
posición de fondo |
Sitúe dentro de la ilustración sprite, si se utilizan sprites CSS. Consulte también Sprites CSS . |
Este botón admite las dos variables state
y selected
selectores de atributos, que pueden utilizarse para aplicar diferentes aspectos a distintos estados de botones. En particular, selected='true'
corresponde al estado “pantalla completa” y selected='false'
corresponde al estado “normal”.
La información del botón se puede localizar. Consulte Localización de los elementos de la interfaz de usuario para obtener más información.
Ejemplo: para configurar un botón de pantalla completa de 28 x 28 píxeles y posicionado 4 píxeles desde la parte inferior y 5 píxeles desde el borde derecho de la barra de control principal. Finalmente, muestra una imagen diferente para cada uno de los cuatro estados de botón diferentes cuando se selecciona o no.
.s7ecatalogsearchviewer .s7fullscreenbutton {
bottom:4px;
right:5px;
width:28px;
height:28px;
}
.s7ecatalogsearchviewer .s7fullscreenbutton [selected='false'][state='up'] {
background-image:url(images/enterFullBtn_up.png);
}
.s7ecatalogsearchviewer .s7fullscreenbutton [selected='false'][state='over'] {
background-image:url(images/enterFullBtn_over.png);
}
.s7ecatalogsearchviewer .s7fullscreenbutton [selected='false'][state='down'] {
background-image:url(images/enterFullBtn_down.png);
}
.s7ecatalogsearchviewer .s7fullscreenbutton [selected='false'][state='disabled'] {
background-image:url(images/enterFullBtn_disabled.png);
}
.s7ecatalogsearchviewer .s7fullscreenbutton [selected='true'][state='up'] {
background-image:url(images/exitFullBtn_up.png);
}
.s7ecatalogsearchviewer .s7fullscreenbutton [selected='true'][state='over'] {
background-image:url(images/exitFullBtn_over.png);
}
.s7ecatalogsearchviewer .s7fullscreenbutton [selected='true'][state='down'] {
background-image:url(images/exitFullBtn_down.png);
}
.s7ecatalogsearchviewer .s7fullscreenbutton [selected='true'][state='disabled'] {
background-image:url(images/exitFullBtn_disabled.png); }
}