Flexitive currently supports hover state animations, such as pulsing or growing, when a user hovers over an element. This will also be visible when a user taps and holds on an object with a hover state applied for a mobile device or tablet.



In order to apply a hover state, select the element that you wish to apply a hover state to and open the Animation Effects panel on the left-hand side of the editor. Open the Other tab, and the Hover State options will be at the top of the panel. 



By clicking on the drop-down, you can select a the Hover State animation. If you would like to preview the animation, hover over the animation in the drop down.



Every Hover State animation has a default duration. After you have selected a Hover State animation, you can speed up or slow down the animation using the Duration slider. Increasing the duration will slow the animation down, and reducing the duration will speed the animation up.



For an example of a hover state animation, hover over the Celebrate Coffee text or the adaptivebean.com button in the example below.



Text Underline Hover State


When applying a hover state to a Flexitive text element, you will have the option to apply a "Text Underline" hover state in addition to the standard hover state options.



When a "Text Underline" hover state is applied to text, if a user hovers over that text, an underline will appear under the text, matching the color and styling of the text.