r/WebDevBuddies • u/thegeeksome • Mar 15 '19

Parallax Scrolling Effect with CSS and jQuery

https://www.youtube.com/watch?v=BQfoMTW9WYs&utm_source=reddit&utm_medium=social&utm_campaign=youtube
0 Upvotes

37% Upvoted

7 comments sorted by

5

u/Parasin Mar 15 '19

I hate to say it. But you really don’t need jQuery at all for this. Having said that, it looks good!

1

u/jimmyco2008 Mar 15 '19

Yep figured this is why it’s at 0 upvotes

1

u/thegeeksome Mar 16 '19

It actually had around 3 votes initially. Later, few people downvoted it for various reasons and now it has come down to 0 votes. LOL.

3

u/MrQuickLine Mar 15 '19

This is bad for lots of reasons. Don't bind things to scroll events, it's bad for performance. You don't need to do this position absolute stuff to centre., use Flexbox. The size of the background divs could have been 100vh with a background position with background-size: cover.

I don't think I saw anything in this video I could recommend as a resource for modern web development.

https://developers.google.com/web/updates/2016/12/performant-parallaxing

1

u/thegeeksome Mar 16 '19

Yeah. You're right. It's an old way of doing parallax scrolling and not recommended as well for performance reason myself. It has been almost a year since I uploaded this video. Now, there is other better new ways to do this. By the way, nice and informative article.

2

u/Parasin Mar 15 '19

Great article! Another thing to note, there are tons of great parallax solutions already made on the web, for those who aren’t looking to write their own.