PushIn.js

About PushIn.js

PushIn.js is a lightweight parallax effect, built with JavaScript, that simulates an interactive dolly-in or push-in animation on a webpage.

Working Demo

Scroll over the image below to try out this effect.

Scroll to begin

PushIn.js

How to use PushIn.js?

Read the Installation Guide to learn more about how to use this on your own projects.

You can also check out the GitHub README for more information about this plugin and how to contribute!

Compatibility

PushIn.js supports all browsers that are ES5-compliant (IE8 and below are not supported).

How does it work?

This plugin uses a combination of JavaScript and CSS to create the illusion of objects moving forward or backward by manipulating their scale while the user scrolls on the page. The effect uses the modern browser's built in requestAnimationFrame to deliver a performant experience that is cross-browser compatible.

  • Zero dependencies!
  • No canvas elements!
  • No webGL!
  • No flash!

How much does this cost?

PushIn.js is completely free open source code under the MIT License.

What do I do if I'm experiencing an issue or have questions?

Please submit a bug report so I can put on my detective hat and look into it further!

You can also open a discussion on the GitHub Discussions board to ask questions or seek assistance.

How can I contribute to this documentation?

Please submit a ticket if you find any issues, or go ahead and open a pull request if you'd like to contribute!

View on GitHub