The slideshow always takes up the full width, and the height will adapt automatically based on the defined ratio. Optionally, limit it by a min or max height. The height can also adapt to the height of the viewport. Additionally, set the text color of the content and navigation to either light or dark.
American Black Bear
The Secret Life of Bears
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient.
Adipiscing elit duis commodo ligula eget dolor Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem.
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip.
Choose one of the different slideshow transitions and add an additional Ken Burns animation for the image.
Pull
Animation Pull
Meta Text
Above the Sky
Photography
Push
Animation Push
Meta Text
Desert Island
Photography
Slide
Animation Slide
Meta Text
A Light in the Distance
Photography
Scale
Animation Scale
Meta Text
Sand Beaches
Photography
Ken Burns
Meta Text
Animation Ken Burns
Photography
In the Jungle
Navigation
Add a dotnav or a thumbnav navigation and an additional slidenav to navigate to the previous and next slides. Define the position, margin and color for each navigation.
If the thumbnav is selected, set the width and the height for the thumbnail image and define whether thumbnails wrap into multiple lines if the container is too small. SVG images can be injected into the page markup and further styled with CSS. Optionally, select a different image for the thumbnail.
Overlay
The slideshow images can have a text overlay. Define its position, style and width. If no width is set in the section or row, and the slideshow takes the full width, its overlay text can be aligned in the same way as a section container. Select a transition for the overlay when sliding between items.
Instead of an overlay transition, create a parallax effect by moving the overlay, title, meta, content and link at different speeds while sliding between the slideshow items.
Options for the different content fields are very similar across all elements. They are described in the corresponding Image, Headline, Text and Button elements.