How to swap widgets using a Mouseover Effect

In many cases, we may need to change a text widget or swap an image on mouse hover. This can be achieved using the opacity effect. This will make the top widget fully transparent on hover, revealing the widget beneath. Please find the preview URL below for an example.

Example Mouseover

How to add this effect:

• Place both the text or image widgets on top of each other. The widget you want to display initially should be on top, while the widget that you want to display on mouse hover should be beneath it.
• Next, select the top widget.
• Go to the Effects option under the Design category on the right side of the experience canvas.
• Click the "+" icon next to Effect option.
• Choose the Mouseover effect. From the available effects.
• Select Opacity and set it to 0%.

This is how you can create an image or text swap on mouse hover. If you have any additional questions, please feel free to reach out to us at support@getfastr.com