Лог появляющийся в textarea
 

Привет всем.
Увидел на форуме вот такой скрипт
http://www.xiper.net/examples/html-a...lip-click.html

мне нужно сделать что бы в этом примере, в textarea выносился лог действий, то есть строка что анимация началсь и строка что анимация закончилась, поможет ли кто то готовым кодом?

Я никогда не разбирался в работе JS именно с css-анимацией (это, собственно, никогда нафиг и не нужно было), поэтому не знаю создаются ли события начала и окончания анимации (очень вряд ли создаются).
Я бы реализовал нужное очень примерно так:

var timer=false,
	animDuration=500,//Продолжительность анимации
	button=document.getElementById('button'),
	textarea=document.getElementsByTagName('textarea')[0];
	
button.addEventListener('click',function(){
	textarea.value+="\n"+'Animation begin.';
	if(timer!==false)
		clearTimeout(timer);
		
	timer=setTimeout(function(){
		textarea.value+="\n"+'Animation end.';
	},animDuration);
});

transitionend
animationend

Animation Events

рони, спасибо, буду знать, что такие события существуют)

Я не могу понять как этим пользоваться, вставил перед закрытым тегом head, добавил текст ареа на страницу, но оно не заполняется

onload или вниз страницы

Однако у меня в условии задания именно сказано что:

- окончание анимации ячейки в консоль выводить на реальное завершение анимации, а не по таймеру

а ваш метод как я понял именно по таймеру работает

Megazupik,
клик начало анимации, у вас уже есть -- ссылки с примерами окончания тоже. сложите пазл.

<script>
var	button=document.getElementById('button'),
	textarea=document.getElementsByTagName('textarea')[0];
	
button.addEventListener('click',function(){
	textarea.value+="\n"+'Начало процесса';

		
	function showMessage() {
		textarea.value+="\n"+'Конец процесса';
    
}
var element = document.getElementById("card");
element.addEventListener("transitionend", showMessage, false);
});

</script>

Получился вот такой код, но он не кажется красивым, можно ли как то укоротить?И как сделать чтобы по завершению вращения одного блока начинал крутится следующий?

Megazupik,
Пожалуйста, отформатируйте свой код!

Для этого его можно заключить в специальные теги: js/css/html и т.п., например:

[js]
... ваш код...
[/js]

О том, как вставить в сообщение исполняемый javascript и html-код, а также о дополнительных возможностях форматирования - читайте http://javascript.ru/formatting.