Diapositiva anterior

Al seleccionar este botón, el usuario vuelve a la diapositiva anterior del conjunto de carrusel. Este botón no se muestra en dispositivos táctiles. 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:

.s7carouselviewer .s7panleftbutton

La información del objeto del botón se puede localizar. Consulte Localización de los elementos de la interfaz de usuario para obtener más información.

Por ejemplo, supongamos que desea configurar un botón de diapositiva anterior de 60 x 60 píxeles. Se debe colocar a diez píxeles del borde izquierdo del visor y centrarlo verticalmente. Y desea que muestre una imagen diferente para cada uno de los cuatro estados de botón diferentes.

.s7carouselviewer .s7panleftbutton {
 bottom: 50%;
 left: 10px;
 background-size:60px;
 cursor: pointer;
 }
.s7carouselviewer.s7mouseinput .s7panleftbutton {
 width:60px;
 height:60px;
 margin-bottom: -20px;
}
.s7carouselviewer.s7mouseinput .s7panleftbutton[state]  {
    background-image: url(../../viewers/s7viewers/html5/images/v2/CarouselDotsLeftButton_dark_sprite.png);
}

.s7carouselviewer.s7mouseinput .s7panleftbutton[state='up'] { background-position: -0px -60px;  }
.s7carouselviewer.s7mouseinput .s7panleftbutton[state='over'] { background-position: -0px -0px; }
.s7carouselviewer.s7mouseinput .s7panleftbutton[state='down'] { background-position: -0px -0px; }
.s7carouselviewer.s7mouseinput .s7panleftbutton[state='disabled'] { background-position: -0px -60px; }