In this example, we will create a parallax scrolling effect on a background image. To do so:
- Add a background image to your box or section in the background section in the styles tab
- While in the styles tab, scroll down to the custom CSS properties section and add:
- Scroll back up to the background section and make sure the image has these styles applied:
Image position: center
Background repeat: no repeat
Background size: cover
These styles will ensure that the image is centered and scaled properly. Now, scroll down your page to see the parallax effect in action!
View an example of a parallax effect here.