Skip to content

Combines animate.css via animate-sass and a jQuery plugin for easy integration.

License

Notifications You must be signed in to change notification settings

creative-workflow/jquery.animate.css

Repository files navigation

jquery.animate.css Build Status Code Climate

This package makes the usage of the beautiful https://daneden.github.io/animate.css/ very easy by bundling animate-sass for selective animation style including and a jQuery plugin for easy usage on your website.

Save bandwith and time =)

Installation

$ bower install jquery.animate.css --save

or

$ npm install jquery.animate.css --save

Import into sass

You have to include the animate-sass into your sass sources and enable the animations you want to use later on your website.

A typical sass file looks like:

// $use-all: true

$use-bounce: true

@import "[path_to_bower_components]/creative-workflow.animate-sass/animate"

Note: For all configurations look at the file [path_to_bower_components]/animate-sass/helpers/_settings.scss

Include in your website

Just load the javascript file [path_to_bower_components]/jquery.animate.css/dist/jquery.animate.css.js.

Note: Dont't forgett to include your compiled css file ^^.

Usage in javascript

$('img').fadeOut(500)
        .animateCss('bounceOut', 500);

methods

animateCss: (animateCssAnimation, [duration=400], [complete=null])

Triggers an animate.css animation included by sass-animate.

  • animateCssAnimation: The animation that should be triggered.
  • duration: Animation duration in milli seconds.
  • complete: An optional callback function when animation finishes.

Dependencies

Resources

Authors

Tom Hanoldt

Contributing

Check out the Contributing Guidelines

About

Combines animate.css via animate-sass and a jQuery plugin for easy integration.

Resources

License

Stars

Watchers

Forks

Packages

No packages published