Create parallax scrolling with CSS

This page summarizes the projects mentioned and recommended in the original post on dev.to

Our great sponsors
  • Appwrite - The Open Source Firebase alternative introduces iOS support
  • Sonar - Write Clean JavaScript Code. Always.
  • InfluxDB - Access the most powerful time series database as a service
  • matterday.netlify.com

    A site that asks us what we could do with more time.

    Lynn wrote an excellent blog post on how she created this effect. I need to pick through it in more detail to unlock all of the tricks she used! The code is available on GitHub.

  • Stimulus

    A modest JavaScript framework for the HTML you already have

    And it was simple from a development standpoint, too — as Richárd explains. “We use a super tiny JS framework called Stimulus. It lets us create small JavaScript components that are controlled by HTML data attributes,” he continues. With just a few extra HTML data parameters, the team could control horizontal and vertical velocity based on the speed of scrolling. “So larger objects and elements can move slower and the smaller ones can move faster in the virtual space,” Richárd concludes.

  • Appwrite

    Appwrite - The Open Source Firebase alternative introduces iOS support . Appwrite is an open source backend server that helps you build native iOS applications much faster with realtime APIs for authentication, databases, files storage, cloud functions and much more!

  • GreenSock-JS

    GreenSock's GSAP JavaScript animation library (including Draggable).

    There is a time when you will need to reach for JavaScript. If you want an animated scroll experience, this is where JavaScript will be called for. GreenSock is the best JavaScript library for web animation.

NOTE: The number of mentions on this list indicates mentions on common posts plus user suggested alternatives. Hence, a higher number means a more popular project.

Suggest a related project

Related posts