Adding Hover Over Effects To Images On Your Website

Make your website spring to life by adding hover-over effects to images on your page. Check out the steps below to see how...

Adding hover effects to images on your site

  1. From within the WebStarts editor, click to select the image you wish to add the hover effect to.
  2. Click the Edit Style icon.
  3. Scroll down and choose a Hover Effect from the Hover Effects drop down.
  4. Scroll down a bit further and enter a Title and Description in the fields provided.
  5. Click the Effect Settings button to edit even more settings for the particular style chosen, including colors, font size, and font weight.

Adding hover effects to images within a photo gallery


  1. From within the WebStarts editor, click to select the Photo Gallery you wish to add the hover effects to.
  2. Click the Edit Style icon.
  3. Scroll down and choose a Hover Effect from the Effects drop down.
  4. Scroll down a bit further and click the Edit Text button to  enter a Title and Description for each image in your Gallery, followed by the Finish button when complete.
  5. Click the Effect Settings button to edit even more settings for the particular style chosen, including colors, font size, and font weight.


Be sure to save the changes to your page and view your changes on your live site.