The Rollover Image Effect widget for Elementor creates a smooth visual transition by swapping one image with another when the user hovers over it, enhancing user engagement and adding interactivity to your website. This widget is perfect for enhancing product displays, showcasing creative portfolios, creating engaging galleries, or adding interactive visual elements to any section of your website. With its seamless design and easy-to-use settings, it’s a must-have for adding flair and functionality to your Elementor projects.
Let’s look at each of the options in the Rollover Image Effect widget for Elementor below.
Add a Rollover Image Effect Widget to Elementor
This widget requires Unlimited Elements Free version installed and activated on your WordPress website.
- Go to Unlimited Elements Widget Library
- Search in the search bar for “Rollover Image Effect”
- Hover over the widget in the search results and click install
- Add the “Rollover Image Effect” widget to any Elementor Page
General Settings
Image One
Choose the first image for rollover image effect.
Image One Size
Select the image size for first image.
- Full
- Large
- Medium
- Thumbnail
- 1536*1536
- 2048*2048
Image Two
Choose the second image for rollover image effect.
Image Two Size
Select the image size for second image.
- Full
- Large
- Medium
- Thumbnail
- 1536*1536
- 2048*2048
Link
Type or paste URL to link with the image.
Transition Length
Set the transition duration.
Rollover Image Effect Widget Styling
You can customize the border, radius, and layout to ensure the widget looks and functions exactly as you envision.
General Styling
You can set the border, radius, shadow, and size of image.
Main Image Styling
Style the main image filter and image fit.
Overlay Image Styling
You can set the image filter and image fit of overlay image.
Rollover Image Effect Design Examples For Elementor
Here are some live use cases for the Rollover Image Effect Widget.
Rollover image effect as a full width gallery.
Rollover image effect with woo products.
Thank you for exploring the Rollover Image Effect widget! We hope this widget inspires you to create visually captivating and interactive designs for your Elementor-powered website. If you have any questions or need further assistance, don’t hesitate to reach out to our support team