Simple slider type
You can select Simple slider type at the Project creation.
Basic behavior
The Simple slider type is what people commonly known as slider. It displays one slide at a time, which always has the same size as the slider.
Configuration
The Simple slider type adds a bunch of new options to your slider.
Animation tab
You can find these options at of the Slider settings → Animations tab.
Main Animation
The Main animation is a basic animation which can move both the slide backgrounds and layers.
The Main Animation
affects:
- layers, if they have no layer animations
- background images and colors, if they have no Background animation
- slide background video
Main Animation
The direction of the Main animation.
No animation: The slides change without animation.
Note: due to browser issues, you cannot have a truly 0MS main animation. So with this option 100MS fade animation will be used.
- Fade: The current slide fades out and reveals the next one behind.
- Crossfade: The current slide fades out and at the same time the next one fades in.
- Horizontal: The current slide moves to the left and the next one comes in from the right.
- Vertical: The current slide moves upwards and the next one comes in from below.
- Horizontal - reversed: The current slide moves to the right and the next one comes in from the left. This direction is available at the Simple slider type only.
- Vertical - reversed: The current slide moves downwards and the next one comes in from above. This direction is available at the Simple slider type only.
Duration
The amount of time the animation takes to complete. The larger the value the more time it takes for the animation to finish. So basically, it's the speed of the animation.
Delay - Pro
The slide will wait the given amount of time before moves away when the slide switching action is fired. For example, if you set it to 2000MS (which is 2 seconds) then the slide switching won't start for 2 seconds after an arrow was pressed.
☝️ Note: Looking for the Autoplay feature? Find it at the Autoplay tab.
Easing - Pro
The pace of the animation. You can see them here.
Carousel - Pro
Your slider can either have a beginning and an end, or it can be a carousel, meaning that after the last slide the first will come. If you turn off the carousel, the left arrow will disappear on the first slide, and the right arrow will disappear on the last slide. Also the autoplay will stop at the last slide.
Background Animation
Background Animation
☝️ Note: The Background animation can also be set for each slide at Slide → Content tab → under Animations.
Background animations can move the slide background images and colors. They have no effect on slide background videos or layers.
⚠️ Warning: Background Animations have the following limitations:
- The Morph and Distortion animations only work on images which have Fill selected at their Fill mode either Slider settings → Slides or at the Slide.
- The Morph and Distortion animations aren't handled by all browsers smoothly. Some of them have flashing bugs (we saw them in Firefox and got feedback on iOS and other mobile browsers), which cannot be avoided from our end. Often new versions of these browsers solve these issues.
- They're disabled if the Background parallax is enabled.
- Some background animations don't work properly with a gradient overlay.
- Many background animations don't look properly with the Ken Burns effect. If you want to use both, make sure you pick an animation that looks good with it.
Speed
The speed of the background animation.
Shifted - Pro
Shifted is the option deciding, when the Background animation should be played, since your layers are moving out with the basic animation, these two animations are separate, and you can choose to make your background animation wait for the layers or to not to wait for the layers, so it would happen together or "auto" means, that if your slide has layers on it, the background animation will wait, and if you don't, the animation won't wait, because if it would be just turned on, it could wait too much on the slides not having layers on them.
Ken Burns effect - Pro
You can enhance your slide background images with a cool zooming and panning Ken Burns effect.
☝️ Note: The Ken Burns Effect needs even the still image to be scaled up a little bit. This means that your selected background images will be cropped from the sides.
Speed - Pro
Defines how fast the effect will be.
Strength - Pro
Defines how much bigger/smaller your image can get from it's original size.
Slides tab
You can find these options at of the Slider settings → Slides tab.
Slide CSS - Pro
You can give any CSS code, which will be applied to the slides. Write the codes without selector. For example:
background-color: white;