Hover effect - How to make an interactive website?
Popular practices
What is the hover effect?
How to add a hover effect in BOWWE
BOWWE animations library - Embed Code and Custom Code
Interactive design can add a touch of style and personality to your site and help you to to make your website look more advanced.
If you're looking for improving your design - read this tutorial and make your online presence shine with BOWWE Builder.
Popular practices
BOWWE lets you customize your hover effect any way you want it. Below we prepared a few examples you can easily add to enhance your website:
Button hover effect
Image hover effect
Card hover effect
What is a hover effect?
How to add a hover effect in BOWWE
- Open your project in BOWWE Builder
- Select the element you want to edit and go to Widget Styles
- Switch tabs between “Basic” and “On hover”
- Create an effect by editing styles in separate tabs
- Basic tab: view of the element before a user interacts with it
- On hover tab: effect appears when a user hover their cursor over the element
How to make custom animation on hover
By customizing the elements separately in the Basic and On Hover tabs, you can edit their appearance before and after user interaction.
Every change you make on basic tab is inherited by corresponding properties in hover tab. If you change something on the hover tab, it doesn't affect styles you set in the basic tab.
BOWWE animations library - Embed Code and Custom Code
Our BOWWE animations are perfect to add a more dynamic feel to your website, but we understand that you might have more complex needs for your animations, or even have entire videos animated somewhere. For this we can recommend our tutorial on adding an embed code to your project: