In your Adobe Muse website you can choose fluid, fixed breakpoints or combine them. If you select fixed breakpoints, you can add scroll effects. In this tutorial I am going to show you how to apply opacity scroll effects in Muse.

opacity-scroll-effect-muse1

 

Open the Scroll Effects tab an select opacity to activate the options. The most important part is to understand what the values mean:

opacity-scroll-effect-muse2

  • First value is the behaviour of the element before the key point
  • Second value is the key point. 
  • Third value is the behaviour of the element after the key point.

What I want to achieve is that when I scroll down, elements will appear. First they will not be visible but when you reach to a point, they will all appear. This is how to do it:

  • Select the element and open the Scroll Effects tab.
  • Type the first value. As I want the element to appear, it needs to be set to 0% opacity.
  • Add the key point. I want the element to completely appear when it hits the key point, so set the value to 100% opacity.
  • Select the third value and set it to 100% opacity too.

You can add opacity scroll effects to as many web elements as you want. Watch the tutorial to see how it is done.

Comments

comments