To animate any element add .animated class and then add one of the available classes which specify the fading effect.

Detailed documentation and more examples of animations you can find in our Bootstrap Animations Docs.

Examples of available animation classes:

  1. .animated .fadeIn
  2. .animated .fadeInDown
  3. .animated .fadeInUp
  4. .animated .fadeInLeft
  5. .animated .fadeInRight
  6. .animated .fadeInDownBig
  7. .animated .fadeInUpBig
  8. .animated .fadeInLeftBig
  9. .animated .fadeInRightBig

Note: In the example below 1 sec delay to the animation. It is added via JavaScript and it's not necessary to make the animation working properly.

A view on mountains.
Cottage on a lake surrounded by mountains.
Cyclist riding down the mountain path.
View on mountains from mountain top.
Rocky shore in the morning.
Rocky shore in the morning.