How to Enable Parallax Effect in Scrolling & Disable it on Squarespace 2026

Sign in at squarespace.com — Continue with Google is the quickest route if your account is linked to a Google profile — and open the site you want to change from your dashboard. Navigate to the page carrying the background image you want to animate, then click Edit to switch from the preview into the page editor.

You'll know you're in edit mode when a toolbar appears across the top with SAVE and EXIT on the left, undo and redo arrows beside them, and desktop and mobile view icons on the right. Parallax is a section property, so it can only be set from inside this editor, not from Site Styles.

Move your cursor over the section with the background image and a small floating menu appears at its right-hand edge. The top entry is EDIT SECTION, which is the one you want; below it sit VIEW LAYOUTS, a row of icons for duplicating, saving and reordering the section, and REMOVE at the bottom.

Take a moment to confirm you're hovering the right section before clicking — on a hero banner the menu can overlap the navigation, and REMOVE sits close enough to be a genuine hazard. Blue ADD SECTION buttons mark the boundaries above and below, which is a reliable way to see where the section you're editing actually starts and ends.

Edit Section opens a settings panel on the right with tabs for the section's layout, colours and background. Choose Background — this is where the image or video behind the section is managed — and then click into Image Effect.

Squarespace keeps this one level deeper than the image itself, which is why so many people go looking for a parallax switch in Site Styles and never find one. The panel that opens has a BACK link at the top left so you can step back up to the background settings without closing the section editor.

The Image Effect panel presents the options as a grid of thumbnails rendered with your own background image rather than as a text list, so you can see roughly what each one does to your photo. The first tile is NONE, which is the default and the state you return to when you want the background static.

The remaining tiles are the available effects, and the currently selected one is highlighted with two small icons for shuffling and fine-tuning its settings. Click the parallax tile to apply it. A note under the grid points out that image effects only render in certain contexts — which is the quirk worth knowing about before you decide it isn't working.

Click SAVE in the top-left toolbar — nothing you changed applies until you do, and clicking EXIT first will discard the change. Then leave the editor and scroll the actual published page, because the editor's preview does not reproduce the scrolling motion faithfully: the effect depends on the page scrolling normally, which the editor's canvas doesn't do.

Check the section on a phone as well as a desktop browser. Parallax is deliberately reduced or ignored on some mobile browsers and for visitors who have switched on a reduced-motion accessibility preference, so a background that drifts on your laptop may sit still on a phone — that's expected behaviour, not a bug in your setup.

Disabling is the same path in reverse: hover the section, Edit Section, Background, Image Effect, and choose NONE (or a different effect), then SAVE. It's worth doing on any section where the effect fights the content — parallax works on a large, simple hero image with plenty of empty space, and looks cheap on a busy photo or a short section where the background barely moves before it scrolls past.

One or two parallax sections per page is the practical limit; beyond that the page feels unsteady and, because each effect adds scroll-linked work for the browser, slower on mid-range phones. If a background image is doing a job — showing a product, carrying text — leave it static.