Trusted answers to developer questions
Trusted Answers to Developer Questions

Related Tags

css
parallax

How to add a parallax scrolling effect using CSS

Educative Answers Team

The parallax scrolling effect is a 3-Dimensional effect used on various websites. This effect makes the website more visually appealing as it causes the background of the webpage to move at a different speed than the foreground. Parallax scrolling​ effect can be implemented with the help of CSS.

Key-words

Syntax

background-attachment

This property is used to set whether a background image is fixed or scrollable.

svg viewer

background-position

This property determines the starting position of the background image.

svg viewer

background-repeat

This property is used to set whether a background image will repeat or not.

svg viewer

background-size

This property is used to set the size of the background image.

svg viewer

Example with the parallax effect

Example without the parallax effect

RELATED TAGS

css
parallax
Copyright ©2022 Educative, Inc. All rights reserved
RELATED COURSES

View all Courses

Keep Exploring