August 28, 2018 Master Admin Dummy content, Shortcodes 0

Here we have some elements that will be animated when they appear on the screen.

First, let’s add some buttons. A button with a simple “tada” animation goes first.

[button color=”dark-gray” link=”http://thememotive.com/” open_in_new_window=”yes” icon_right=”m-icon-arrow-right” wide=”no” class=”” id=”” style=”” rel=”” onclick=”” animation=”tada”]Tada![/button]

And now, a button with a delayed animation. Tadaaaaaaaa!

[button color=”orange” link=”http://thememotive.com/” icon_right=”m-icon-arrow-right” wide=”no” class=”” id=”” style=”” rel=”” onclick=”” animation=”tada” animation_delay=”1″]Tada again! (but later)[/button]

Milestones also can be animated:

[milestone start=”0″ end=”100″ speed=”1000″ prefix=”+” suffix=”%” color=”#f66000″ font_size=”90″ class=”” animation=”rubberBand”]

[milestone start=”0″ end=”500″ speed=”1500″ prefix=”+” suffix=”%” color=”#f66000″ font_size=”90″ class=”” animation=”rubberBand” animation_delay=”1″]

Now, an image:

[img src=”https://multi.michal-pawelczyk.net/wp-content/uploads/2017/11/robert-lamb-5397-800×533.jpg” alt=”Image description” title=”Image title” width=”” height=”” link=”http://thememotive.com/” animation=”fadeIn”]

Let us test a counter:

One more test counter goes here:

Now, a row of icon boxes

[columns]
[one_third][icon_box icon=”icon-arrow-right” title=”Icon box” animation=”flipInY” animation_delay=”0.1″]This is a box with an icon and some animation.[/icon_box][/one_third]
[one_third][icon_box icon=”icon-arrow-right” title=”Icon box” animation=”flipInY” animation_delay=”0.5″]This is another box with an icon and some animation.[/icon_box][/one_third]
[one_third][icon_box icon=”icon-arrow-right” title=”Icon box” animation=”flipInY” animation_delay=”0.5″]This is yet another box with an icon and some animation.[/icon_box][/one_third]
[/columns]

Rate this article

★★★★★

Animated shortcodes 0 (0 votes)