Parallax
Parallax scrolling is an effect where the background is scrolled at a different speed compared to the foreground.
Source
<?= \macgyer\yii2materializecss\widgets\media\Parallax::widget([
'imageSrc' => '/img/sample-parallax.jpg'
]) ?>
<div id="w0">
<div class="parallax-container">
<div class="parallax">
<img src="/img/sample-parallax.jpg" alt="" style="transform: translate3d(-50%, 356.84px, 0px); opacity: 1;">
</div>
</div>
</div>
Rendered result
Photo by Wolfgang Hasselmann @ Unsplash