Advanced Button Hover Over Effects

This is an advanced walkthrough. For simple button hover effects, read Add button hover effects.

Add an Animated Effect to an Object Offered by Hover.css

  1. Download hover.css.zip to be able to create your effects.
  2. Find the file and unzip it on your computer.
  3. Drag the hover.css file on to your page where you want to create an effect while in editing mode.
  4. Pick a desired effect from this list and copy it’s name (ex. hvr-hang).
  5. Click on the object you want to have the effect appear on.
  6. Open the “Advanced” tab in the Editing Menu.
  7. Click “CSS Selectors”.
  8. In the “Classes” field paste the name of the effect you chose (ex. hvr-hang).
  9. Click “Save” and “View Live” to see your effect in action.

Still need help?

Contact Pagecloud support and include your site address and the step you are stuck on.