Appearance

In this section you will find style related settings for the slider. The most important parameter is the Skin here. This define the design of the control arrows and dots. There are many predefined skin available, and you can also try all of them on the demo site. Under the main slider, hover on the Select the skin! button, and you can select all of the available skins.

The slider settings section contains hidden options which can be displayed separately. The main goal is to remove clutter from the user interface, since these options control overly specific features, or they meant to be used by experienced users. You can display these options with the switch on the upper right corner. These parameters will be marked similarly, as this text in the whole documentation.

Appearance settings

Slider appearance

With the Initial fade duration for the slider animation when the page loads. Set it to 0 to disable this feature.

You can also add Custom slider CSS for the current slider.

Slider global background

With the Background-color option you are able to set a background color for the whole slider, and with the Background image you can use an image as bg. Please note that all of the content placed on the slides and layer will appear above this image.

The Background behaviour default value is scroll which mean normal behavior for the background of the slider. But if you set it for Fixed value, you will get the same result what you can see on the Fixed BG slider demo page.

The Background position property sets the starting position of a background image. You can use percent and pixel values here.

With the Background size option you can specify the selected background's size. You can use fix values like 60px 80px and predefined constants as well:

Auto

This is the default value. The background-image contains its width and height.

Cover

Scale the background image to be as large as possible so that the background area is completely covered by the background image. Some parts of the background image may not be in view within the background positioning area.

Contain

Scale the image to the largest size such that both its width and its height can fit inside the content area.