# Parallax Effects
The template has a parallax plugin built-in. You can use it to create fancy motion effects for your images and backgrounds.
Use the data-art-parallax="true"
attribute whenever you want to create a parallax scrolling effect on an element. You can also adjust the direction and/or speed using the data-art-parallax-factor="0.3"
attribute. Negative values are also acceptable.
# Markup: Images
<div class="section-figures__item col-lg-6 section section-figures__item_no-paddings" data-art-parallax="true" data-art-parallax-factor="0.15">
<div class="lazy">
<img data-src="img/assets/project5/img-5-2.jpg" width="960" height="960" src="#" alt=""/>
</div>
</div>
# Markup: Backgrounds
<div class="section section_h-800 section-masthead__background section-masthead__background_bottom section_h-900" data-art-parallax="true" data-art-parallax-factor="-0.09">
<div class="art-parallax__bg lazy-bg" data-src="img/assets/projects/bg-1.jpg"></div>
</div>
Don’t forget that the parent background container should have a height set somehow. Otherwise, you won’t see anything because of 0px height.