top of page

How to create hover interactions

PROJECTS USED

Start Now
Start Now
Start Now
Start Now

TAGS

SUITABLE FOR

Editor X

ABOUT

Want to add hover interactions to your Wix site? Here's how you can.

Layout

01. Add a container
02. Make the container a square
03. Add a 2x2 grid
04. Add a shape in one cell
05. Place the shape in the container
06. Center the container and set the size
07. Duplicate to other cells and replace shapes

Layout

Add paragraph text. Click “Edit Text” to customize this theme across your site. You can update and reuse text themes.

Interactions

01. Add a hover trigger to a shape container
02. Select the affected element on stage
03. Add an effect to the shape
04. Set the shape to move horizontally: X -100%
05. Repeat the hover interaction with all the other shapes

Interactions

Add paragraph text. Click “Edit Text” to customize this theme across your site. You can update and reuse text themes.

HAVING TROUBLE?

Contact our VIP support channel at vip@support.wix.com and our team will contact you within 24 hours.

MORE HOW TO'S

How to move elements to random positions

How to use the Blog API

How to create dynamic lightboxes

How to create a floating image effect

How to create image hover interactions in a list

How to create big buttons

bottom of page