What are the Animate Effects I can apply to element interactions or page actions?

There are a number of effects you can apply to element interactions or buttons in Claro (see Insert a button for more information). Action effects can be added to show, hide, or toggle elements. See the two page sample course, Effects, to view interaction effects applied to an image.

Effects can also be added to page actions.

Note: When choosing an effect, you can select the Preview button next to Effect pulldown menu. This will animate the effect's icon for a mini-preview to help you chose the an effect prior to application.


Action Effects

Fade: fades in or out

Slide: moves in from or out to the edge of the element’s borders

  • To the left
  • To the right
  • Up
  • Down

Fly: moves in from or out to the edge of the page

  • To the left
  • To the right
  • Up
  • Down

Blind: rolls down from the top or rolls up from the bottom

Clip: rolls up from the middle or rolls down from the middle

Drop: moves in or out like the slide but with a fade effect

  • To the left
  • To the right
  • Up
  • Down

Fold: rolls in from the top then folds down or rolls out from the bottom then folds up

Note: Certain networks have experienced issues with the Slide effect when used with rich media. If you are consistently experiencing issues when using Slide in conjunction with rich media, you may want to select an alternate effect such as Fade.

Animate Effects

Bounce: bounces up and down five times

Pulsate: pulses/flashes five times

Shake: shakes back and forth five times

Move By: moves the element a specific number of pixels from its current location (use a plus + or minus - in front of the number of pixels for the X and Y coordinates, e.g. "+100")

Move To: moves the element to a specific X and Y coordinate, e.g. "300")

Transparency: gradually changes the element's opacity to a value of your choosing.

Rotation: rotates the element stopping at the set value in degrees.

Scale To %: scales the element's Width and/or Height to the set percentage values.

Zoom To %: will zoom in or out on element by the set Height/Width percentages while respecting the elements original boundaries.

Pan and Zoom: allows you to perform the same function as Zoom To % with the added function of panning the element's coordinates by positive or negative pixel values.

Note: If you want an element to Move By or Move To in only one direction, check your element's current X/Y coordinates using Positioning on the element toolbar. Move By and Move To require a number in the Coordinates field.


Was this article helpful?
0 out of 0 found this helpful
Have more questions? Submit a request