Do you want to add an auto image scrolling effect to a section in WordPress? Adding an auto image scroll effect to your WordPress container background. This effect allows for a seamless transition of images, creating a visually stunning and captivating user experience.
With the Container block from the Nexter Blocks, you can easily add an auto image scrolling effect to a section in WordPress.
To check the complete feature overview documentation of the Nexter Blocks Container block, click here.
Requirement – This block is a part of the Nexter Blocks, make sure it’s installed & activated to enjoy all its powers.
Add the Container block with the appropriate layout to the page and follow the steps –
1. Go to Style > Background Middle Layer.
2. Select Auto Moving Layer from the Select Background Option dropdown.
3. In the Image List section, you’ll find two items by default.
4. Open one item, in the Select Image section you have to add your image.
From the Background Size dropdown, you can set the background size of the image.
5. Then from the Direction dropdown, you have to select the image scrolling direction. You can set the scrolling direction to the left, right, top or bottom.
From the Opacity field, you can manage the image opacity.
From the Transition Speed section, you can manage the animation speed.
From the Responsive Visibility toggle, you can hide the image on different devices.
Then in the Z-index field, you can add a z-index value to overlap the image over other elements.
You can repeat the process to edit the other item.
Note: You must set lower than 1 opacity for the overlapping image if you want to add multiple background images.
You can click on the + Add Item button to add more images.
Now you’ll see an auto image scrolling section.
