Secondary control bar secondary-control-bar

The secondary control bar is the rectangular area that contains First and Last Page buttons and a Page Indicator when made available in CSS.

By default, it is displayed on mobile phones only and is positioned in the bottom of the viewer. It always takes the whole available viewer width. It is possible to change its color, height, and vertical position by CSS, relative to the viewer container.

The appearance of the secondary control bar is controlled with the following CSS class selector:

.s7ecatalogviewer .s7secondarycontrols .s7controlbar

CSS property
Position from the top of the viewer.
Position from the bottom of the viewer.
The height of the main control bar.
The background color of the secondary control bar.

Example - to set up a gray secondary control bar that is 72 pixels tall and is positioned at the bottom of the viewer container.

.s7ecatalogviewer .s7secondarycontrols .s7controlbar {
 bottom: 0px;
 height: 72px;