AP Smart LayerSlider - Carousel demo

Carousel example #1

  • Full Width. This example illustrates the possibility to arrange the slides in a carousel layout while also stretching the slider to the full width of the page, by checking “Force Size” to “Full Width” and “Visible Size” to “100%” in admin's parameters. The “Force Size” property is useful when slider might be inside other containers which are less than full width/window. It will still enlarge the slider to fill the width or window by overflowing its parent elements. Even though the slider resides in a container that has a maximum width of 1170px, this feature makes it possible to have a full-width (or full-window) slider without making changes to the page's layout.
  • Slide Distance (margin) is set to 0px. This indicates the gap (margin) between slides.

Carousel example #2

  • Visible Size. This example illustrates use of “Visible Size” to “100%” in admin's parameters. This sets the size of the visible area, allowing for more slides to become visible near the selected slide. If you set to '100%' other slides will become visible near the selected slide and '100%' will be actually “Slide Width” (274px). If you set to 'auto', only the selected slide will be visible.
  • Loop is enabled. Indicates if the slider will be loopable (infinite scrolling). Slider is loopable by default, but if you don't want for some reason to loop slides, it can be disabled.
  • Auto Height. Indicates if height of the slider will be adjusted to the height of the selected slide.
  • Autoplay. Indicates whether or not autoplay will be enabled. It sets an delay/interval (in milliseconds) at which the autoplay will run. In this example is: '7000' (7 seconds).
  • Slide Distance (margin) is set to 10px. This indicates the gap (margin) between slides.

Other examples:


Accordion Menu

Recently Visited