Basic Configuration

Please download our library using button below

Add stylesheet to HEAD section:

<link href="$PATH/svg-animate.min.css" rel="stylesheet" type="text/css"> 

Add library script:

<script src="$PATH/svg-animate.min.js"></script>

Add your SVG logo to page with svg-animate class. For example:

<img id="logo" class="svg-animate" src="$PATH/$FILENAME.svg" alt="logo">

And run animation using this code:

SVGAnimate.init({
    element: 'img#logo'
});

Element is your image selector so If you have other ID please change it.

Advanced Configuration

If you have used our generator you can load your animations:

SVGAnimate.init({
    element: 'img#logo',
    animations: '$CONFIG'
});

Be Careful! Configuration is STRING (it needs apostrophes) !!!

React Component

If you use React you can download our library here. Simple usage:

import React, {Component, PropTypes} from 'react';
import SVGAnimate from '$PATH_TO_LIBRARY/SVGAnimate';

class ConfirmEmailPage extends Component {

    componentDidMount() {
        SVGAnimate.init({
            element: 'img#logo'
        });
    }
    ...
}