вот код
function animate ( opts ) {
var start = new Date,
properties = opts.properties,
elem = opts.target,
post, id;
for( var prop in properties ) {
post = getUnits( properties [prop]. post );
elem.style [prop] = properties [prop].from + post ;
}
(function anim() {
var progress = (new Date - start) / opts.duration,
from, to;
if (progress > 1) progress = 1;
for( var prop in properties ) {
from = properties [ prop ].from;
to = properties [ prop ].to;
post = getUnits( properties [prop]. post );
elem.style [ prop ] = ( ( to - from ) * progress + from ) + post;
};
if (progress == 1) {
opts.complete && opts.complete();
return;
}
id = setTimeout( anim, opts.delay || 20 ) ;
}());
function getUnits ( val ) {
if ( val === undefined )
return "px";
return val;
};
return function() {
clearInterval ( id );
}
}
вот пример вызова
properties = {
top : { // свойство которое анимируем
from: rect.top,
to: top
},
left: {
from: rect.left,
to: left
},
width: {
from: 0,
to: width.val,
post: width.units,
},
height: {
from: 0,
to: height.val,
//post - единицы измерения в которых анимируем, по умолчанию px
},
opacity: {
from: 0,
to: 1,
post: "%"
}
};
animate({
target : win, // окно которое анимируем
delay: 15,
duration: 2000, // время анимация в милесекундах
properties: properties, // объект со свойствами которые анимируем
// complete: - тут можно передать callback
});