In 10Web Website Builder, you have the capability to craft dynamic backgrounds for containers by setting up a slideshow of images. This allows for intricate designs and layouts with smooth transition effects to add visual interest.
Adding a background slideshow
To configure a background slideshow:
- Edit your page/website with the 10Web Builder
- Click on the desired container
- Click on the Style tab
- Navigate to the Background type
- Click on the Slideshow icon
Configuring the slideshow background
Add images: Click Add Images to select which images you want in the slideshow. After selection, confirm by clicking Create a New Gallery > Insert Gallery.
Infinite loop: Toggle to YES to cycle the slideshow without end.
Slide duration: Set how long each slide is displayed, measured in milliseconds.
Slide transition: Select the transition effect for slides, options include Fade, Slide Right, Slide Left, Slide Down, or Slide Up.
Transition duration: Determine the transition speed between slides in milliseconds.
Background size: Decide the size of the background images, with choices like Default, Auto, Cover, or Contain.
Background position: Pick the focal point for the background image from options such as Default, Top Left, Top Center, Top Right, Center Left, Center Center, Center Right, Bottom Left, Bottom Center, or Bottom Right.
Lazy Load: Toggle this option to ON to improve page load speeds by loading images only as they become visible to the user.
Ken Burns effect: Activate this to apply a subtle zoom and panning effect to your background images.
Direction (Ken Burns Effect): If the Ken Burns Effect is enabled, select whether the zoom direction should be In or Out.