How to create an Easy Rollover Effect Over Images

Adobe Muse offers you some tools to create a rollover effect without using widgets. You can play with opacity, shadows or even add some colour. You can find four different States in Adobe Muse: Normal, Rollover, Mouse Down and Active. You can find these States on the top left of your workspace or on the “States Window”. You can apply four different states to your elements. We want to images to be normal but when the mouse rolls over the images, we want to change its appearance to boost the design.

First you have to select the images where you are going to apply the effect. Open the State Window and click on “Rollover”.

screen-shot-2016-11-21-at-18-41-31

Now, choose the effect that you want to apply to the photos. As an example, when the mouse rolls over the images, we want the images to fade and we want a coloured border to appear.

To create a coloured border, go to Stroke. We are going to colour the border blue and increase its width to 4 pixels.

screen-shot-2016-11-21-at-18-46-54

To play with its opacity, bring down the opacity bar to 50%

screen-shot-2016-11-21-at-18-48-28

Click on “Fade” and select its speed. You can display more  options here. We are going to choose Ease in/ease out with  one second duration.
screen-shot-2016-11-21-at-18-49-43

And you are done!

Leave a Comment

Your email address will not be published. Required fields are marked *

Scroll to Top