# Hover Animation

<figure><img src="https://lh4.googleusercontent.com/L_axqMaCXp4hNk7xzy-qpnPu2fEsqPLnz2Iz3396rXuyZbqE-x0lcwFrtUqv1c64vyk_XpCR4ZB9hLizKBDb405u0AZuuoMcZHAr4e5Gd3hqYFlYUyyd8ecKpUMWREG__FN0KEqzryPS9g9DO8WwF5du5I0jievkKh1tE99v4Y4I2TqAxDYBMyfS59o1Aw" alt=""><figcaption></figcaption></figure>

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

{% hint style="danger" %}
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.
{% endhint %}

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.

![](https://lh5.googleusercontent.com/Oe0svRL4peZNT7KrTLPHiOK_uzBovXH6j4wycrBG60rmbVy7H1JjeMtzcIz_Yq_XpAhDxUc9JPfvSQXS5HbDrzZCItSU6TkeJEU6XUgNc1417JuypXTuQTWYv7M43tbkWVwUFnIwGTKojsYfzRS1vhBGBJ8seX-eIB2l4b6DvFX_vgT-0QKnO8bpoQGflA)

## **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.

<details>

<summary>Hover Animations</summary>

***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.

</details>

![](https://lh5.googleusercontent.com/3uvdKM2EssHUz1SMMk0XX_FCVejqnj_ckv0aSjz3QrLaG-bo-n0HTV8vRhfco_hMTVR4yuZIY8E6iHJXDBMUOXKYC7WFYRyrutQnvS6tRayLOmG_P0cD3-eW1cy_yfNXORXHTAEJqk1tnnsUsbD1M1OxKB9beZ3GgeaOwxLNUmktkmW7zC8s-kszHLrt6w)

## 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.

![](https://lh4.googleusercontent.com/WVpFta1E9Qqz7y8dQgjVDCcodXNPs_B11HqrcEh4qHVfAUtJSu9RJiE1d1BZYvrnKb3tMl-v3ICXZLNYY71bJokKw1STGegN_OadCa_76Ikz5IHb8G5ktnV6NgObCadI1Mm62PzqgCF4GwZeXDICrb8om-q1SA-WvokSj6g1SvFbiaibjChQPM22_QBsYw)


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.cwicly.com/interactions/hover-animation.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
