Elements - Sandal

English

- 8:00 am to 10:00 pm

### Talk to us now

+49 555 000 000

### Visit our offices

Mirage Plaza - Hamburg

### Send us an email

hello@sandal.com

### We are open all day

8:00 am to 10:00 pm daily

# Elements

## 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-slide-bottom', 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-slide-bottom', 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-slide-bottom', 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>`

Sandal LLC.
Hamburg, Germany
One Street | Two Drive,
10th Floor, Site Wing
+49 555 000 000
hello@sandal.com
support@sandal.com

### Recent Posts

- Have faith in your abilities
  Believe in yourself! Have faith in your abilities! Without a...
- Live in the only moment
  Always continue the climb. It is possible for you to...

### Our Work

- Gaucho Cafe
- Fontaine Corp
- Saffron Magazine
- Celsius gallery
- Fidelity business
- Lighthouse Church
- Sauna Spa

### Our Values

Do not dwell in the past, do not dream of the future, concentrate the mind on now.

Let reality be reality. Let things flow naturally. Do not dwell in the past, do not dream of the future.

Copyright © Sandal Template by arrowthemes