Wix Editor: Adding and Setting Up a Hover Interaction

6 min read
Bring your boxes, repeaters, and elements to life by adding hover interactions. These are effects that your visitors see when hovering over the elements you choose.
Make elements appear or disappear, add effects and change colors on mouseover. You can also control the timing of your effects to maximize their potential.
Gif of hover effect being used on Wix site. Hover shows butterfly fluttering its wings.

Step 1 | Add and design an element

Hover interactions add fun and movement to your site. To get started, add either a box or repeater from the Add Elements panel.
Click an option below to learn more about adding each element: 

Step 2 | Access hover mode

After adding and designing your element, access hover mode to start adding interactions. This is where you control what visitors see as they hover over your box or repeater.

To access hover mode:

  1. Select your box / repeater in the editor.
  2. Depending on your element, do the following to access hover mode:
    • Box: Click the Hover Interactions icon  .
    • Repeater: Click any container in the repeater and select the Hover Interactions icon .
  3. Click Get Started.
Tip:
Once you've accessed hover mode for the first time, you can switch between regular and hover mode using the tabs at the top of the element.
screenshot of box in wix editor highlighting the regular and hover tabs.

Step 3 | Add hover interactions to your element


From hover mode, you can make elements appear or disappear and add cool effects. Everything happens simultaneously when visitors hover over your box or repeater item. 

Choose what you want to do:

Did this help?

|