Hover Animation

The Hover Animation property allows you to easily add a predefined & pre-made animation to any block.

The Hover Animation property is only available on the button, icon and image blocks. These animations can easily be created for any other block through the advanced tab properties.

As the name implies it, the selected animation will play whenever the user hovers over the block.

• Select the required block (button, icon or image).

• Navigate to the Primary tab of the Block Inspector.

• Find Hover Animation property.

• Select required animation.

Hover Animations

A choice of Hover Animations is available such as: None, Grow, Shrink, Pulse, Push, Pop, Bounce in, Bounce out, Rotate, Zoom rotate, Rise, Set, Levitate, De-levitate, Skew, Wiggle vertical, Wiggle horizontal, Shake out.

Hover Animations

None No hover animation.

Grow Makes the block scale up.

Shrink Makes the block scale down.

Pulse Makes the block grow and shrink on a continuous loop while hovered.

Push Makes the block shrink and come back to its original size while hovered.

Pop Makes the block grow and come back to its original size while hovered.

Bounce In Makes the block grow with an added bounce effect.

Bounce Out Makes the block shrink with an added bounce effect.

Rotate Makes the block rotate to its right.

Zoom Rotate Makes the block rotate to its right while growing.

Rise Makes the block rise by a few pixels.

Set Makes the block drop by a few pixels.

Levitate Makes the block rise and come back to its original position while hovered on a continuous loop while hovered.

De-Levitate Makes the block drop and come back to its original position while hovered on a continuous loop while hovered.

Skew Makes the block skew to the left.

Wiggle Vertical Makes the block wiggle up and down a few times.

Wiggle Horizontal Makes the block wiggle left and right a few times.

Shake Out Makes the block slightly rotate left and right a few times.

Remove Animation

• Select the required block (button, icon or image).

• Navigate to the Primary tab of the Block Inspector.

• Find Hover Animation property to remove.

• Click blue button to reset.