How to add Parallax Effects to Images

Questions
1

I wish to add a Parallax Effect to an image so that it appears as though the contents of the image are moving upwards whilst the user scrolls down.

How do I do this?

1 Like
2

Hey,

can you send me one example, some website that has this effect?

3

Something similar to this please: https://codepen.io/gusevdigital/pen/MWZKyom

I’ve tried to do it with the Tilt and Locomotive Scroll plugins but haven’t had any success.

4

I started working on a plugin for this simple effect, its almost done, we will publish it tomorrow.

4 Likes
5

Hey, a bit late, been busy with other stuff, sorry. But here it is.

We created two plugins that you can combine for best experience.

  • Lenis Smooth Scroll
  • Image Parallax - Scroll Effect

At this moment, they are not published yet, they will live tomorrow probably (or maybe tonight), and you will able to use them. Check video below on how you can make parallax image effect.

One thing I forgot to mention in video: Your image needs to wrapped in a div

3 Likes
6

I am waiting for it too :kissing_heart:

8

Hi @Pakic

Can the new plugins: Parallax Image - Scroll Effect, Lenis Smooth Scroll be installed with other plugins like Simple Scroll Animations, Locomotive Scroll?

Maybe is a good idea to put a note about plugins integrations with other plugins inside of the plugins notes

All the best

9

I am not sure about Lenis, Parallax image will not impact anything else. Maybe you can be the first one to experiment that. :slight_smile:

I am 99% sure that Simple Scroll Animation will work together with Lenis, but since Locomotive Scroll includes its own Smooth Scroll, it might have conflict with Lenis.

10

Thanks

I am happy and excited to be the first to try your new plugins.

And I am already doing the testing before I configure new plugins on my website.

11

Thank you for publishing this plugin so swiftly!

For going above and beyond to support myself and other divhunters in this community, I thought I could atleast make the effort to write you a review. Its on Trustpilot.

You and the team are doing excellent work and being able to partake in your journey as an early adopter brings me great pleasure.

Keep up the good work :sunglasses:

12

Thank you very much, we really appriciate it! :slight_smile:

If anyone is reading this and likes what we do, please follow Nstar’s example, and rate us on Trustpilot, it will mean a lot to keep growing our business reputation and making Divhunt even better.

Here’s the link: Divhunt Reviews | Read Customer Service Reviews of divhunt.com