Помогите оптимизировать скрипт смены изображений с анимацией

[Khmelevsky]

Здравствуйте.
Нужно было реализовать такую задачу.
Есть три ссылки, по клику на которые появляется картинка соответствующая этой ссылке (появляются с анимацией, простая смена opacity), картинки находятся друг под другом с разными z-index и смена картинки происходит с плавным перетеканием с одной в другую. Я это реализовал, на кроссбраузерность еще не проверял, но мое решение явно корявое, хочу попросить вас помощи оптимизировать его.
Вот код, я попытался его обильно продокументировать, чтобы было проще разобраться в моей писанине:

function next() {
	// глобальная переменная которая хранит значение прозрачности
	var opacity = 0;
	// глобальная ссылка на таймер
	var timer;

	// Функция, которая рекурсивно вызывается для смены значение прозрачнности нужного div,
	// функции передается ссылка на объект на котором сработал onclick
	function changeOpacity(handler) {
		// делаем анимацию с шагом 2
		opacity += 2;
		// блок который должен появится имеет id такой же, как и ссылка на которой сработал
		// onclick + "-inf". получаю этот блок
		block = document.getElementById(handler.id+"-inf").style;
		// устанавливаем свойство прозрачности для ie и всех остальных
		block.opacity = opacity/100;
		block.filter="alpha(opacity="+opacity+")";

		// создаю глобальную переменную, в которой хранится ссылка на объект на
		// котором сработал onclick, чтобы я смог ей воспользоваться внутри
		// анонимной функции
		// !!! очень не нравится это решение
		var _handler = handler;
		// собственно рекурсивно через таймер выполняю ету функцию, уменьшая прозрачность
		timer = setTimeout(
				function(){
					changeOpacity(_handler);
				}, 0);

		// если прозрачностьдошла до предела, очищаю таймер
		if (opacity>100) {
			clearTimeout(timer);
		};
	}

	// new-vd - div элемент-контейнерв котором расположен весь этот блок с
	// картинками и сслками-переключателями. Получаю его
	parrentBlock = document.getElementById("new-vd");

	// Проверяю отображается на верху сейчас тот объект по которому клацнули
	// (чтобы не делать анимацию того объекта который сейчас виден и так),
	// если нет, выполняю анимацию
	// не нравится, что приходится хранить идентификатор в виде атрибута
	if (parrentBlock.getAttribute("vdCur") !== this.id) {
		// z-index самого верхнего элемента также хранится в атрибуте
		// тоже кажется коряво, незнаю как исправить
		zIndex = parseInt(parrentBlock.getAttribute("zidx")) + 1;
		// увеличиваю значение атрибута zIdx на 1
		parrentBlock.setAttribute("zidx", zIndex);
		// устанавливаю текущим элементов, тот элемент по которому клацнули
		parrentBlock.setAttribute("vdCur", this.id);

		// получаю блок который буду анимировать
		block = document.getElementById(this.id+"-inf").style;
		// выставляю его прозрачность в 0
		block.opasity = 0;
		block.filter="alpha(opacity=0)";
		// и помещаю его на самый верх
		block.zIndex = zIndex;

		// ну и анимирую, описанной выше функцией
		changeOpacity(this);
	}
}

Решение явно не ахти, я плохо знаком с javascript, поэтому вышло вот так. Что мне не нравится:
1. То что приходится хранить id текущего блока который наверху и его z-index в виде атрибутов
2. То что приходится передавать handler через глобальную переменную в каждой итерации рекурсивной функции (явно плохо)

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

PS. Советовать использовать готовую библиотеку, вроде jQuery и т.п. не нужно, скрипт не большой, ради него использовать большой фреймворк нет желания (боремся за каждый килобайт так сказать )

[Gozar]

А что сильные тормоза, заметны?
А смысл кому-то Вам помогать?
Не знаете, ну так прочитайте что такое функции в js и arguments и будет Вам счастье. От кода Вашего сильно попахивает чужеродным ООП, при этом фреймворком вы пользоваться не хотите.

зы: там где борьба за каждый килобайт не место такому обилию комментариев, за ними кода не видать. Тот кто понимает язык тому комменты только мешают в таком количестве. Уберите их все вот вам и оптимизация будет

[Khmelevsky]

А что сильные тормоза, заметны?
А смысл кому-то Вам помогать?
Не знаете, ну так прочитайте что такое функции в js и arguments и будет Вам счастье. От кода Вашего сильно попахивает чужеродным ООП, при этом фреймворком вы пользоваться не хотите.

зы: там где борьба за каждый килобайт не место такому обилию комментариев, за ними кода не видать. Тот кто понимает язык тому комменты только мешают в таком количестве. Уберите их все вот вам и оптимизация будет

странный ответ. По порядку:
>>>А смысл кому-то Вам помогать?
а смысл форумов? а смысл делится опытом? я не попросил мне написать скрипт, я почитал литературу, как смог разобрался, написал то что работает... сейчас, просто, попросил помочь в улучшении кода (не производительности, а в стиле кодирования, некоторые участки кода мне кажутся корявыми)

>>>Не знаете, ну так прочитайте что такое функции в js и arguments и будет Вам счастье.
вот именно, прошу подсказать что почитать чтобы исправить тот или иной кусок кода более лаконично и красиво
>>>От кода Вашего сильно попахивает чужеродным ООП, при этом фреймворком вы пользоваться не хотите.
не знаю чем он вам пахнет, может у вас что-то с обанянием ? что я использую к этому коду, так это только код с статьи этого сайта, как навешивать на нужные мне элементы на их события свои функции (чтобы в теле html документа не было всяких onclick и т.п.)

>>>зы: там где борьба за каждый килобайт не место такому обилию комментариев, за ними кода не видать. Тот кто понимает язык тому комменты только мешают в таком количестве. Уберите их все вот вам и оптимизация будет
во первых я специально так детально откоментировал, чтобы вам было понятно что я кодировал, у меня в коде их намного меньше.
во вторых, очевидно вы не в курсе о всяких js компрессорах, которые убирают все комментарии, переводы строк, лишние пробелы и т.д. Таким образом, для разработки используется нормальная оформленная по стандартам, с комментами версия, а для production, все это ужимается.

[Gozar]

Смысл форумов, ответ стандартный: http://www.phpwiki.ru/%D0%94%D0%BB%D1%8F_%D1%87%D0%B5%D0%B3%D0%BE_%D0%BD %D1%83%D0%B6%D0%B5%D0%BD_%D1%84%D0%BE%D1%80%D1%83% D0%BC

>>>Не знаете, ну так прочитайте что такое функции в js и arguments и будет Вам счастье.
вот именно, прошу подсказать что почитать чтобы исправить тот или иной кусок кода более лаконично и красиво

Это что игра слов? или Вы считаете что я должен лично вам прочитать в слух что такое arguments?
http://javascript.ru/arguments

ну не попахивает, так не попахивает

во вторых, очевидно вы не в курсе о всяких js компрессорах, которые убирают все комментарии, переводы строк, лишние пробелы и т.д.

, а давайте сразу начнем с т.д.
и что же они такое еще делают для "ужимания" кода, кроме сокращения названия переменных?

зы: В вашем случае слишком подробная документация вредит!
лично мне ее читать лень, а во вторых код читать тяжело. Вы код пишете или роман?

[Kolyaj]

и что же они такое еще делают для "ужимания" кода, кроме сокращения названия переменных?

Переменные инлайнят, неиспользуемые куски кода удаляют, например.

[Gozar]

Переменные инлайнят, неиспользуемые куски кода удаляют, например.

Вопрос был адресован не всем, а еще они сносят иногда половину кода.