[Diphenyl Oxalate]

Меня опять троллит джаваскрипт!

Animate.color = function ( elem, attr, to, time ) {
	// поскольку на вход могут подать название цвета ("pink") или hex-значение (#ff69b4)
	// преобразуем его в rgb(205, 105, 180), заставив браузер вычислить его
	var I = document.createElement( "DIV" );
	I.style.backgroundColor = to;
	document.body.appendChild( I );
	var colorEnd = getComputedStyle( I ).backgroundColor.match( /(\w{1,3})/g ); // получаем [205, 105, 180]
	document.body.removeChild( I ); // убираемся за собой
	var colorStart = getComputedStyle( elem )[attr].match( /(\w{1,3})/g ); // начальный цвет элемента

	var start = new Date().getTime();
	setTimeout( function () {
		var diff = new Date().getTime() - start;
		if ( diff < time ) { // alert(diff) даёт 10
			elem.style[attr] = "rgb(" + A( colorStart[0], colorEnd[0], diff/time ) + ", " + A( colorStart[1], colorEnd[1], diff/time ) + ", " + A( colorStart[2], colorEnd[2], diff/time ) + ")";
			setTimeout( arguments.callee, 10 ); // НО НОВЫЙ SETTIMEOUT ПРОСТО НЕ ВЫЗЫВАЕТСЯ, ХОТЬ ТЫ ТРЕСНИ
		}
	}, 10 );
};

function A ( x, y, z ) { // вспом. ф-я для выч. from + (to - from) * (diff / time)
	return +x + (+y - +x) * +z;
}

Вызывается так:

Animate.color( document.getElementById("foo"), "backgroundColor", "black", 1000 );

Причём есть аналогичная функция для изменения других параметров (ширина, высота и т.д.), там всё считается по той же формуле (from + (to - from) * (diff / time)) и работает как надо.