to top

Mon - Fri 8:30 am to 5:00 pm

Talk to us (800) 909 902

Elements

Nothing can be done without hope

Animation

To add animation to any component, use the uk-animate-{transition} class. To learn more about the animation classes, visit the animation component page.


markup
<div data-uk-scrollspy="{cls:'uk-animation-scale-up', delay:500}">
  your elements here
</div>

The data-uk-scrollspy attribute parameters are as follows:

Parameters Description
cls Set the animation type. The animation options can be:
uk-animation-slide-top, uk-animation-slide-bottom, uk-animation-slide-left, uk-animation-slide-right, uk-animation-fade, uk-animation-scale-up, uk-animation-scale-down
delay Set the animation delay in milliseconds. E.g 200

Example


One third

Tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.

One third

Tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.

One third

Tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.

Show code

<div class="uk-grid" data-uk-grid-margin> <div class="uk-width-medium-1-3"> <div data-uk-scrollspy="{cls:'uk-animation-scale-up', delay:100}"> <h3 class="uk-module-title">One third</h3> Tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. </div> </div> <div class="uk-width-medium-1-3"> <div data-uk-scrollspy="{cls:'uk-animation-scale-up', delay:300}"> <h3 class="uk-module-title">One third</h3> Tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. </div> </div> <div class="uk-width-medium-1-3"> <div data-uk-scrollspy="{cls:'uk-animation-scale-up', delay:500}"> <h3 class="uk-module-title">One third</h3> Tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. </div> </div> </div>

Stay in touch with the latest news

We'd like to send you our latest news.

Truford Pro

Truford Pro
Mirage Plaza, Waiyaki Way
Nairobi, Kenya
+254 (800) 909 902
+254 (800) 909 901
info@truford.pro

Partners

We are passionate about what we do. Here are our accolades.

Partners