Parallax
To create a parallax effect on an image, use the data-uk-parallax data attribute.
markup
<div style="height: 350px; background-image: url(images/background/bg-image-1.jpg);" data-uk-parallax="{bg: '-200'}">
</div>
The data-uk-parallax attribute can also be used to add parallax to html elements. To learn more about all the options attribute, see this table
markup
<div data-uk-parallax="{opacity: '0,1', scale: '0.75,1', viewport: '0.5'}">
<h1 class="uk-module-title-alt uk-margin-top">Title goes here</h1>
<h3 class="uk-sub-title">sub title goes here</h3>
</div>
Title goes here
sub title goes here
markup
<div class="uk-text-center uk-contrast uk-flex uk-flex-middle uk-flex-center" style="height: 350px; background-image: url(images/background/bg-image-1.jpg);" data-uk-parallax="{bg: '-200'}">
<div data-uk-parallax="{opacity: '0,1', scale: '0.75,1', viewport: '0.5'}">
<h1 class="uk-module-title-alt uk-margin-top">Title goes here</h1>
<h3 class="uk-sub-title">sub title goes here</h3> </div>
</div>
