All-New: Make it brilliant with responsive scroll effects

We’ve just launched scrolling effects for Moonfruit responsive pages! You can now try out our new effects directly through the editor, so we wanted to share a few more details on this release and how to use these effects to really make your website sparkle.

What is a scroll effect?

A scroll effect is a great way to add visual interest to your website. The effect responds as you move down the page to give an immersive feel and create an illusion of depth. Scroll effects are a great way to keep your website visitors engaged, and even better – are as simple as ever to apply to your Moonfruit responsive pages!

How do I get started?

We currently offer three scroll effects for responsive pages. First up, our fixed effect. When you enable this setting, your chosen background image will, you guessed it, ‘fix’ as you scroll the page while the rest of your page elements scroll past it. You can add this effect to any section, column or row on your responsive page. Second, our zoom effects. These create a zoom in/out effect on your image background as you scroll, to really bring your page to life. You can add a zoom effect to any section on your responsive page.

So, how do you add a scroll effect to your Moonfruit responsive page? With a section or row selected, open the right side panel. Under the ‘Background’ section, select ‘Image’ from the dropdown menu. Next, under the ‘Scroll Effect’ section choose either ‘Fixed’ or ‘Zoom in/out’  from the dropdown to add your effect! Scroll the page a little to test it out, then click ‘Save’ to apply the effect to your live site.

Why not take your website design up a notch by trying out our new scroll effects today? Let us know how you get on in the comments!