javascript - Sliding an element "up" over another as the user scrolls down, without fixed positioning? -

the wording in title weird, apologies. it's hard explain effect.

i have this, works best on chrome: http://mattluckhurst.com/dev/

my client wants each panel slide user scrolls down, covering previous panel. accomplishing setting "current" panel have position:fixed , top:0 page scrolls it. panels each have z-index corresponds vertical position on page. ideally:

you scroll down. when next panel halfway window, scroll animates way there, panel snapped top next 1 can come in on it.

it's working pretty in chrome, getting lot of flickering , stuff elsewhere. on mobile it's mess, want nice smooth swipe down.

i know fixed elements can pretty funky on mobile, wondering if problem, or if should using other window scrolling animation / effect.

i see more complex parallax stuff time, should pretty doable, i'm not sure start.

thanks help! let me know if need more info.

a few libraries might you:

• https://github.com/dirkgroenen/jquery-viewport-checker
• https://github.com/janpaepke/scrollmagic
• https://github.com/matthieua/wow
• https://github.com/jlmakes/scrollreveal.js
• https://github.com/prinzhorn/skrollr