TO
THE NEW
SAY HELLO
2024
No, your eyes aren’t deceiving you.
You can now add Mouse Parallax Effects to any Wix Studio site, no code needed.
Viewing this site on mobile?
This site showcases Mouse Parallax Effects, which respond to cursors. Open it on desktop and watch the magic happen.
1. Click the "Recreate effect" button to open a template that lets you recreate the Mouse Parallax Effect using this design.
2. Select the iris (black circle) on the right-hand side.
3. Click the lightening bolt icon to open the Animations and Effects panel.
4. Select Mouse Effects and click Add.
In the Setup panel, select Track, then click Adjust Animation.
In the Adjust Track panel:
-
Set Distance to 100 px
-
Set Velocity to 0.5
Repeat for the iris on the left-hand side.
1. Select the pupil (small white dot) on the right-hand side.
2. Click the lightening bolt icon to open the Animations and Effects panel.
3. Select Mouse Effects and click Add.
In the Setup panel, select Track, then click Adjust Animation.
In the Adjust Track panel:
Set Distance to 120 px
Set Velocity to 0.3
Repeat for the iris on the left-hand side.
1. Select the star element on the canvas.
2. Click the lightening bolt icon to open the Animations and Effects panel.
3. Select Mouse Effects and click Add.
4. In the Setup panel, select Tilt 3D, then click Adjust Animation.
5. In the Adjust 3D panel:
-
Set Angle to 48
-
Set Velocity to 0.6
-
Set Perspective to 7.5
1. Select the text Parallax (SVG file).
2. Click the lightening bolt icon to open the Animations and Effects panel.
3. Select Mouse Effects and click Add.
4. In the Setup panel, select Obscure, then click Adjust Animation.
5. In the Adjust Obscure panel:
-
Set Blur to 10
-
Set Angle to 10
-
Set Scale to 100%
-
Set Distance to 0 px
-
Set Velocity to 0.3
1. To finish, select the yellow semicircle.
2. Click the lightening bolt icon to open the Animations and Effects panel.
3. Select Mouse Effects and click Add.
4. In the Setup panel, select Track, then click Adjust Animation.
5. In the Adjust Track panel:
-
Set Distance to 20 px
-
Set Velocity to 0.2
-
Select Horizontal in the Movement axis
6. Click “Publish” to preview the final design.
© 2035 by Business Name. Made with Wix Studio™