JSFiddle - React, Tailwind, and code Playground

HTML

<body>
  <div class="parallax_root">
    <div class="prlx back_cat">
      <img src="http://lorempixel.com/200/800/cats/">
    </div>
    <div class="prlx front_food">
      <img src="http://lorempixel.com/800/200/food/">
    </div>
  </div>
</body>

CSS

.parallax_root {
  height: 100vh;
  position: relative;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-perspective: 1px;
  perspective: 1px;
}

.prlx {
  position: absolute;
}

.back_cat {
    transform: translateZ(-1px);
}

.front_food {
    transform: translateZ(-2px);
}