V1.0.0 Release Notes: The main thing you must remember is that if you want to have an animation that starts off unseen, you must give the tag you want animated a display: none in CSS.
Methods
All values are default values that you can change..slideInLeft
Description: Slide in from the left side.Usage:
$('tag').slideInLeft({speed:400, distance: '100px', startOpacity: 0, opacitySpeed: 400});Run down of the settings:
speed: How fast the animation animates.distance: How far away the animation begins.startOpacity: How opaque the tag starts when the animation starts.opacitySpeed: How fast the opacity changes during the animation..slideInRight
Description: Slide in from the right side.Usage:
$('tag').slideInRight({speed: 400, distance: '100px', startOpacity: 0, opacitySpeed: 400});Run down of the settings:
speed: How fast the animation animates.distance: How far away the animation begins.startOpacity: How opaque the tag starts when the animation starts.opacitySpeed: How fast the opacity changes during the animation..slideInDown
Description: Slide in from the top. Usage:$('tag').slideInDown({speed: 400, distance: '100px', startOpacity: 0, opacitySpeed: 400, comeDown: true, comeUp: null});Run down of the settings:
speed: How fast the animation animates.distance: How far away the animation begins.startOpacity: How opaque the tag starts when the animation starts.opacitySpeed: How fast the opacity changes during the animation.comeDown: Tells the animation to come from the top.comeUp: Tells the animation to come from the bottom..slideInUp
Description: Slide in from the bottom.Usage:
$('tag').slideInUp({speed: 400, distance: '100px', startOpacity: 0, opacitySpeed: 400, comeDown: true, comeUp: null});Run down of the settings:
speed: How fast the animation animates.distance: How far away the animation begins.startOpacity: How opaque the tag starts when the animation starts.opacitySpeed: How fast the opacity changes during the animation.comeDown: Tells the animation to come from the top.comeUp: Tells the animation to come from the bottom..slideInDiagonal
Description: Slide in from any corner.Usage:
$('tag').slideInDiagonal({speed: 400, distance: '100px', startOpacity: 0, opacitySpeed: 400, left: true, right: null comeDown: null, comeUp: null});Note: You must choose either
comeDown or comeUp for the animation to run. You can look at the example page to see an example of a diagonal animation.Run down of the settings:
speed: How fast the animation animates.distance: How far away the animation begins.startOpacity: How opaque the tag starts when the animation starts.opacitySpeed: How fast the opacity changes during the animation.left: Tells the animation to come from the left portion of the tag.right: Tells the animation to come from the right portion of the tag.comeDown: Tells the animation to come from the top.comeUp: Tells the animation to come from the bottom.