Home/ Questions/Q 7935557
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-03T21:57:32+00:00

I’m trying to build a parallax site, which will move few elements while scrolling

  • 0

I’m trying to build a parallax site, which will move few elements while scrolling the site.
But instead of using a scroll event listener I’m using requestAnimationFrame, after reading this post by Paul Irish, and this video which said that scroll listener is a bit buggy. My questions are:

  1. It looks quite smooth in Chrome, but it’s flickering badly in Firefox. Did I do something wrong here?
  2. Does my code actually taking up more resources than using normal scroll event listener? I can hear my laptop fan blazing every time I’m playing with this code.

My file is located at http://www.socialbuzz.com.au/index.html, and please scroll to the bottom of the page to see the element that’s being manipulated from javascript.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You should have a the scroll event trigger a requestAnimationFrame loop. Do not have requestAnimationFrame triggered by the scroll event itself. You should have something like a var scrolling = true; While this is happening run your requestAnimationFrame loop which references event data from the scroll event. You’ll need to debounce the scroll event to turn to loop off once you are finished, it’s a chore but the results are worth it. Hope this helps.

    • 0