js实现animate动画效果

HTML

<div class="block" id="block">block</div>
<button id="button">click</button>
<button id="reset">reset</button>

CSS

.block {
    width: 100px;
    height: 100px;
    position: absolute;
    left: 100px;
    top: 0;
    background-color: #ff0000;
}

button {
 float: left;
 clear: both;
}
}

JavaScript

(function(global) {
    var easing, animate, animation, css, pool, run, queue, dequeue, cache, guid, expando;

    guid = 1;

    expando = 'lxjwlt' + (Math.random() + '').replace(/\D/g, '');

    pool = [];

    cache = {};

    // t: current time, b: begInnIng value, c: change In value, d: duration
    easing = {
        def: 'easeOutQuad',
        swing: function (t, b, c, d) {
            //alert(jQuery.easing.default);
            return easing[easing.def](t, b, c, d);
        },
        easeInQuad: function (t, b, c, d) {
            return c*(t/=d)*t + b;
        },
        easeOutQuad: function (t, b, c, d) {
            return -c *(t/=d)*(t-2) + b;
        },
        easeInCubic: function (t, b, c, d) {
            return c*(t/=d)*t*t + b;
        },
        easeOutBack: function (t, b, c, d, s) {
            // if (s == undefined) s = 1.70158;
            if (s == undefined) s = 6;
            return c*((t=t/d-1)*t*((s+1)*t + s) + 1) + b;
        },
        easeOutBounce: function (t, b, c, d) {
            if ((t/=d) < (1/2.75)) {
                return c*(7.5625*t*t) + b;
            } else if (t < (2/2.75)) {
                return c*(7.5625*(t-=(1.5/2.75))*t + .75) + b;
            } else if (t < (2.5/2.75)) {
                return c*(7.5625*(t-=(2.25/2.75))*t + .9375) + b;
            } else {
                return c*(7.5625*(t-=(2.625/2.75))*t + .984375) + b;
            }
        }
    };

    css = function(elem, obj) {
        var prop;

        if (typeof obj === 'object') {
            for (prop in obj) {
                elem.style[prop] = obj[prop];
            }
        } else if (arguments.length === 3) {
            elem.style[arguments[1]] = arguments[2];
        } else {
            return elem.currentStyle ? 
                elem.currentStyle[obj] : getComputedStyle(elem, null)[obj];
        }
    };

    run = function(pool, easing) {
        if (pool[0] === 'run' || !pool.length) return;
        pool.unshift('run');

       ...